% ng new my-app --style=scss
起動する
% cd my-app % ng serve --open
ビルドに失敗する。
% ng serve --open You are running version 6.5.0 of Node, which will not be supported in future versions of the CLI. The official Node version that will be supported is 6.9 and greater. To disable this warning use "ng set --global warnings.nodeDeprecation=false".** NG Live Development Server is listening on localhost:4200, open your browser on http://localhost:4200 ** 10% building modules 8/9 modules 1 active ...ode_modules/style-loader/addStyles.jswebpack: wait until bundle finished: / Hash: 736257371267d73edf59 Time: 7329ms chunk {0} polyfills.bundle.js, polyfills.bundle.js.map (polyfills) 171 kB {4} [initial] [rendered] chunk {1} main.bundle.js, main.bundle.js.map (main) 6.45 kB {3} [initial] [rendered] chunk {2} styles.bundle.js, styles.bundle.js.map (styles) 9.59 kB {4} [initial] [rendered] chunk {3} vendor.bundle.js, vendor.bundle.js.map (vendor) 2.18 MB [initial] [rendered] chunk {4} inline.bundle.js, inline.bundle.js.map (inline) 0 bytes [entry] [rendered] ERROR in ./~/css-loader?{"sourceMap":false,"importLoaders":1}!./~/postcss-loader?{"ident":"postcss"}!./~/sass-loader/lib/loader.js?{"sourceMap":false,"precision":8,"includePaths":[]}!./src/styles.scss Module build failed: Error: ENOENT: no such file or directory, scandir '/Users/adam/development/angular/tutorial/my-app/node_modules/node-sass/vendor' at Error (native) at Object.fs.readdirSync (fs.js:951:18) at Object.getInstalledBinaries (/Users/adam/development/angular/tutorial/my-app/node_modules/node-sass/lib/extensions.js:124:13) at foundBinariesList (/Users/adam/development/angular/tutorial/my-app/node_modules/node-sass/lib/errors.js:20:15) at foundBinaries (/Users/adam/development/angular/tutorial/my-app/node_modules/node-sass/lib/errors.js:15:5) at Object.module.exports.missingBinary (/Users/adam/development/angular/tutorial/my-app/node_modules/node-sass/lib/errors.js:45:5) at module.exports (/Users/adam/development/angular/tutorial/my-app/node_modules/node-sass/lib/binding.js:15:30) at Object.(/Users/adam/development/angular/tutorial/my-app/node_modules/node-sass/lib/index.js:14:35) at Module._compile (module.js:556:32) at Object.Module._extensions..js (module.js:565:10) at Module.load (module.js:473:32) at tryModuleLoad (module.js:432:12) at Function.Module._load (module.js:424:3) at Module.require (module.js:483:17) at require (internal/module.js:20:19) at Object. (/Users/adam/development/angular/tutorial/my-app/node_modules/sass-loader/lib/loader.js:3:14) @ ./src/styles.scss 4:14-189 @ multi ./src/styles.scss ERROR in ./src/app/app.component.scss Module build failed: Error: ENOENT: no such file or directory, scandir '/Users/adam/development/angular/tutorial/my-app/node_modules/node-sass/vendor' at Error (native) at Object.fs.readdirSync (fs.js:951:18) at Object.getInstalledBinaries (/Users/adam/development/angular/tutorial/my-app/node_modules/node-sass/lib/extensions.js:124:13) at foundBinariesList (/Users/adam/development/angular/tutorial/my-app/node_modules/node-sass/lib/errors.js:20:15) at foundBinaries (/Users/adam/development/angular/tutorial/my-app/node_modules/node-sass/lib/errors.js:15:5) at Object.module.exports.missingBinary (/Users/adam/development/angular/tutorial/my-app/node_modules/node-sass/lib/errors.js:45:5) at module.exports (/Users/adam/development/angular/tutorial/my-app/node_modules/node-sass/lib/binding.js:15:30) at Object. (/Users/adam/development/angular/tutorial/my-app/node_modules/node-sass/lib/index.js:14:35) at Module._compile (module.js:556:32) at Object.Module._extensions..js (module.js:565:10) at Module.load (module.js:473:32) at tryModuleLoad (module.js:432:12) at Function.Module._load (module.js:424:3) at Module.require (module.js:483:17) at require (internal/module.js:20:19) at Object. (/Users/adam/development/angular/tutorial/my-app/node_modules/sass-loader/lib/loader.js:3:14) @ ./src/app/app.component.ts 18:17-48 @ ./src/app/app.module.ts @ ./src/main.ts @ multi webpack-dev-server/client?http://localhost:4200 ./src/main.ts webpack: Failed to compile.
node-sassをインストールする
% npm install node-sass --save-dev
もう一度、起動する。
% ng serve --open You are running version 6.5.0 of Node, which will not be supported in future versions of the CLI. The official Node version that will be supported is 6.9 and greater. To disable this warning use "ng set --global warnings.nodeDeprecation=false".** NG Live Development Server is listening on localhost:4200, open your browser on http://localhost:4200 ** 10% building modules 6/9 modules 3 active ...ode_modules/style-loader/addStyles.jswebpack: wait until bundle finished: / Hash: 3a75be2f4a4fec742f94 Time: 7565ms chunk {0} polyfills.bundle.js, polyfills.bundle.js.map (polyfills) 171 kB {4} [initial] [rendered] chunk {1} main.bundle.js, main.bundle.js.map (main) 5.28 kB {3} [initial] [rendered] chunk {2} styles.bundle.js, styles.bundle.js.map (styles) 10.7 kB {4} [initial] [rendered] chunk {3} vendor.bundle.js, vendor.bundle.js.map (vendor) 2.18 MB [initial] [rendered] chunk {4} inline.bundle.js, inline.bundle.js.map (inline) 0 bytes [entry] [rendered] webpack: Compiled successfully.
起動した!