Comment intégrer PostCSS dans Broccoli angular-cli Build?

Question

Il semble que ce script de construction est en cours d'exécution, mais le CSS qui est produit n'est pas minifié ou préfixé automatiquement. J'essaye de compiler SASS, puis exécute la sortie via Post CSS avec Broccoli et l'angulaire-cli. Je me dis que peut-être que des gens de braise pourraient aussi aider. Qu'est-ce que je fais mal?

La construction émet ce dans le terminal:

Slowest Trees         | Total    
----------------------------------------------+--------------------- 
BroccoliTypeScriptCompiler     | 1274ms    
vendor          | 502ms    
PostcssFilter | 465ms   

mais le CSS est le même que si elle était sortie de SASS, pas poster CSS.

Voici my-cli-angulaire build.js:

'use strict'; 
/* global require, module */ 


const Angular2App = require('angular-cli/lib/broccoli/angular2-app'); 
const compileSass = require('broccoli-sass'); 
const compileCSS = require('broccoli-postcss'); 
const cssnext = require('postcss-cssnext'); 
const cssnano = require('cssnano'); 
const mergeTrees = require('broccoli-merge-trees'); 
const Funnel = require('broccoli-funnel'); 
const _ = require('lodash'); 
const glob = require('glob'); 


var options = { 
    plugins: [ 
    { 
     module: cssnext, 
     options: { 
      browsers: ['> 1%'], 
      warnForDuplicates: false 
     } 
    }, 
    { 
     module: cssnano, 
     options: { 
      safe: true, 
      sourcemap: true 
     } 
    } 
    ] 
}; 


module.exports = function(defaults) { 

    let sourceDir = 'src'; 
    let appTree = new Angular2App(defaults, { 
     sourceDir: sourceDir, 
     sassCompiler: { 
     includePaths: [ 
      'src/style' 
     ] 
     }, 
     vendorNpmFiles: [ 
     'systemjs/dist/system-polyfills.js', 
     'systemjs/dist/system.src.js', 
     'zone.js/dist/*.js', 
     'es6-shim/es6-shim.js', 
     'reflect-metadata/*.js', 
     'reflect-metadata/*.js.map', 
     'rxjs/**/*.js', 
     '@angular/**/*.js', 
     'rxjs/**/*.js.map', 
     '@angular/**/*.js.map', 
     'd3/d3.js', 
     'three/build/three.js', 
     'three/examples/js/postprocessing/*.js', 
     'three/examples/js/shaders/*.js' 
     ] 
    }); 


    let sass = mergeTrees(_.map(glob.sync('src/**/*.scss'), function(sassFile) { 
     sassFile = sassFile.replace('src/', ''); 
     return compileSass(['src'], sassFile, sassFile.replace(/.scss$/, '.css')); 
    })); 

    let css = compileCSS(sass, options); 

    return mergeTrees([sass, css, appTree], { overwrite: true }); 
}; 

Answer 1

Il était l'ordre des opérations, mes arbres ne sont pas appTree Écrasement des!

Cela fonctionne! return mergeTrees([appTree, sass, css], { overwrite: true });