且构网

分享程序员开发的那些事...
且构网 - 分享程序员编程开发的那些事

angular-cli如何添加Sass和Bootstrap?

更新时间:2023-09-30 10:23:34

注意:由于Angular CLI的更改,此答案已过时,请参考Woot上的以下最新答案.

NOTE: This answer is out of date due to changes in the Angular CLI, please refer to the answer below from Woot which is more current.

您需要通过npm i node-sass --save-dev安装node-sass,然后将angular-cli.json中的styleExt更改为sassscss(或者可以通过ng set defaults.styleExt scss

You need to install node-sass via npm i node-sass --save-dev then change your styleExt in angular-cli.json to either sass or scss (or you can set that via ng set defaults.styleExt scss

对于引导程序,将其放置在public目录下(我使用名为style的子目录)并在index.html

As for bootstrap, place it under the public directory (I use a sub dir named style) and reference it within index.html

更新: 另外,如果您想拥有变量文件,可以像这样将目录添加到angular-cli-build.js ...

UPDATE: Also if you'd like to have variables files you can add the directory to angular-cli-build.js like this...

return new Angular2App(defaults, {
  vendorNpmFiles: [
    ...
  ],
  sassCompiler: {
    includePaths: [
      'src/app/style' <-- directory for SASS reference files
    ]
  }
});