2016-06-01 11 views
1

이 빌드 스크립트가 실행 중이지만 출력되는 CSS가 축소되거나 자동 접두사가 아닌 것 같습니다. 나는 SASS를 컴파일하려고 시도하고있다. 그런 다음 브로콜리와 각도 -Cli를 가진 Post CSS를 통해 출력을 실행한다. 아마 어떤 엠버 클라이 (ember-cli) 사람들도 도움이 될 것이라고 생각합니다. 내가 도대체 ​​뭘 잘못하고있는 겁니까?Brocoli angular-cli Build에 PostCSS를 어떻게 통합합니까?

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

을하지만 CSS 올리지, SASS 출력 것처럼 CSS는 동일 :

빌드 터미널이 출력된다.

은 여기 내 각-CLI-build.js : 그것은, 내 나무 appTree 덮어 쓰기되지 않은 작업의 순서가

'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 }); 
}; 

답변

0

이었다!

이것은 작동합니다! return mergeTrees([appTree, sass, css], { overwrite: true });