Angular-cli: Configuring Sass file in angular-cli-build.js did not compile

Created on 8 May 2016  路  9Comments  路  Source: angular/angular-cli

angular-cli: 1.0.0-beta.1
node: 4.4.3

I dont know I configued the sass file from npm was correct.

vendorNpmFiles: [
      'systemjs/dist/system-polyfills.js',
      'systemjs/dist/system.src.js',
      'zone.js/dist/*.js',
      'es6-shim/es6-shim.js',
      'reflect-metadata/*.js',
      'rxjs/**/*.js',
      '@angular/**/*.js',
      '@salesforce-ux/design-system/scss/index.scss'
    ]

after compileing. in dist file it is still sass file, not css

Most helpful comment

Then please guys could you fix the documentation https://github.com/angular/angular-cli#css-preprocessor-integration ? It stills says you should include scss files.

All 9 comments

npm install node-sass --save-dev

should help and you don`t need add that to angular-cli-build.js
Angular Cli will compile SCSS automatically

@Codenator81 I installed node-sass. without angular-cli-build.js. how can I use it?

styleUrls: [
    '@salesforce-ux/design-system/scss/index.scss'
  ],

like this?

@colinshen No you need add for example

styleUrls: ['ngapp.component.css'],

but not scss like

styleUrls: ['ngapp.component.scss'],

just try do

ng build

and find where it is compiled to css

@Codenator81 thanks for your help. I got it.

Then please guys could you fix the documentation https://github.com/angular/angular-cli#css-preprocessor-integration ? It stills says you should include scss files.

The doco is wrong! It does NOT make sense to set styleUrls: [my.scss] at all!

@Bolza @YiniYin the docs are current for the webpack version, which is still in testing and not tagged as latest. I've added a note here: https://github.com/angular/angular-cli/pull/1694

I'm an idiot. my css I was using to test didn't affect anything in the component.

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_This action has been performed automatically by a bot._

Was this page helpful?
0 / 5 - 0 ratings