angular-pro-sidebar icon indicating copy to clipboard operation
angular-pro-sidebar copied to clipboard

found an issue when run script 'ng serve'

Open 839928622 opened this issue 5 years ago • 3 comments

ERROR in ./src/styles.scss (./node_modules/@angular-devkit/build-angular/src/angular-cli-files/plugins/raw-css-loader.js!./node_modules/postcss-loader/src??embedded!./node_modules/sass-loader/lib/loader.js??ref--14-3!./src/styles.scss) Module build failed (from ./node_modules/sass-loader/lib/loader.js): Error: Cannot find module 'node-sass' Require stack:

  • H:\Github\angular-pro-sidebar\node_modules\sass-loader\lib\loader.js
  • H:\Github\angular-pro-sidebar\node_modules\loader-runner\lib\loadLoader.js
  • H:\Github\angular-pro-sidebar\node_modules\loader-runner\lib\LoaderRunner.js
  • H:\Github\angular-pro-sidebar\node_modules\webpack\lib\NormalModule.js
  • H:\Github\angular-pro-sidebar\node_modules\webpack\lib\NormalModuleFactory.js
  • H:\Github\angular-pro-sidebar\node_modules\webpack\lib\Compiler.js
  • H:\Github\angular-pro-sidebar\node_modules\webpack\lib\webpack.js
  • H:\Github\angular-pro-sidebar\node_modules@angular-devkit\build-webpack\src\webpack\index.js
  • H:\Github\angular-pro-sidebar\node_modules@angular-devkit\build-webpack\src\index.js
  • H:\Github\angular-pro-sidebar\node_modules@angular-devkit\build-angular\src\dev-server\index.js
  • H:\Github\angular-pro-sidebar\node_modules@angular-devkit\architect\src\architect.js
  • H:\Github\angular-pro-sidebar\node_modules@angular-devkit\architect\src\index.js
  • H:\Github\angular-pro-sidebar\node_modules@angular\cli\models\architect-command.js
  • H:\Github\angular-pro-sidebar\node_modules@angular\cli\commands\build-impl.js
  • H:\Github\angular-pro-sidebar\node_modules@angular-devkit\schematics\tools\export-ref.js
  • H:\Github\angular-pro-sidebar\node_modules@angular-devkit\schematics\tools\index.js
  • H:\Github\angular-pro-sidebar\node_modules@angular\cli\utilities\json-schema.js
  • H:\Github\angular-pro-sidebar\node_modules@angular\cli\models\command-runner.js
  • H:\Github\angular-pro-sidebar\node_modules@angular\cli\lib\cli\index.js
  • C:\Users\Leo\AppData\Roaming\npm\node_modules@angular\cli\lib\init.js
  • C:\Users\Leo\AppData\Roaming\npm\node_modules@angular\cli\bin\ng at Function.Module._resolveFilename (internal/modules/cjs/loader.js:793:17) at Function.Module._load (internal/modules/cjs/loader.js:686:27) at Module.require (internal/modules/cjs/loader.js:848:19) at require (internal/modules/cjs/helpers.js:74:18) at Object.sassLoader (H:\Github\angular-pro-sidebar\node_modules\sass-loader\lib\loader.js:46:72) ERROR in ./src/app/app.component.scss Module build failed (from ./node_modules/sass-loader/lib/loader.js): Error: Cannot find module 'node-sass' Require stack:
  • H:\Github\angular-pro-sidebar\node_modules\sass-loader\lib\loader.js
  • H:\Github\angular-pro-sidebar\node_modules\loader-runner\lib\loadLoader.js
  • H:\Github\angular-pro-sidebar\node_modules\loader-runner\lib\LoaderRunner.js
  • H:\Github\angular-pro-sidebar\node_modules\webpack\lib\NormalModule.js
  • H:\Github\angular-pro-sidebar\node_modules\webpack\lib\NormalModuleFactory.js
  • H:\Github\angular-pro-sidebar\node_modules\webpack\lib\Compiler.js
  • H:\Github\angular-pro-sidebar\node_modules\webpack\lib\webpack.js
  • H:\Github\angular-pro-sidebar\node_modules@angular-devkit\build-webpack\src\webpack\index.js
  • H:\Github\angular-pro-sidebar\node_modules@angular-devkit\build-webpack\src\index.js
  • H:\Github\angular-pro-sidebar\node_modules@angular-devkit\build-angular\src\dev-server\index.js
  • H:\Github\angular-pro-sidebar\node_modules@angular-devkit\architect\src\architect.js
  • H:\Github\angular-pro-sidebar\node_modules@angular-devkit\architect\src\index.js
  • H:\Github\angular-pro-sidebar\node_modules@angular\cli\models\architect-command.js
  • H:\Github\angular-pro-sidebar\node_modules@angular\cli\commands\build-impl.js
  • H:\Github\angular-pro-sidebar\node_modules@angular-devkit\schematics\tools\export-ref.js
  • H:\Github\angular-pro-sidebar\node_modules@angular-devkit\schematics\tools\index.js
  • H:\Github\angular-pro-sidebar\node_modules@angular\cli\utilities\json-schema.js
  • H:\Github\angular-pro-sidebar\node_modules@angular\cli\models\command-runner.js
  • H:\Github\angular-pro-sidebar\node_modules@angular\cli\lib\cli\index.js
  • C:\Users\Leo\AppData\Roaming\npm\node_modules@angular\cli\lib\init.js
  • C:\Users\Leo\AppData\Roaming\npm\node_modules@angular\cli\bin\ng at Function.Module._resolveFilename (internal/modules/cjs/loader.js:793:17) at Function.Module._load (internal/modules/cjs/loader.js:686:27) at Module.require (internal/modules/cjs/loader.js:848:19) at require (internal/modules/cjs/helpers.js:74:18) at Object.sassLoader (H:\Github\angular-pro-sidebar\node_modules\sass-loader\lib\loader.js:46:72) ERROR in ./src/app/sidebar/sidebar.component.scss Module build failed (from ./node_modules/sass-loader/lib/loader.js): Error: Cannot find module 'node-sass' Require stack:
  • H:\Github\angular-pro-sidebar\node_modules\sass-loader\lib\loader.js
  • H:\Github\angular-pro-sidebar\node_modules\loader-runner\lib\loadLoader.js
  • H:\Github\angular-pro-sidebar\node_modules\loader-runner\lib\LoaderRunner.js
  • H:\Github\angular-pro-sidebar\node_modules\webpack\lib\NormalModule.js
  • H:\Github\angular-pro-sidebar\node_modules\webpack\lib\NormalModuleFactory.js
  • H:\Github\angular-pro-sidebar\node_modules\webpack\lib\Compiler.js
  • H:\Github\angular-pro-sidebar\node_modules\webpack\lib\webpack.js
  • H:\Github\angular-pro-sidebar\node_modules@angular-devkit\build-webpack\src\webpack\index.js
  • H:\Github\angular-pro-sidebar\node_modules@angular-devkit\build-webpack\src\index.js
  • H:\Github\angular-pro-sidebar\node_modules@angular-devkit\build-angular\src\dev-server\index.js
  • H:\Github\angular-pro-sidebar\node_modules@angular-devkit\architect\src\architect.js
  • H:\Github\angular-pro-sidebar\node_modules@angular-devkit\architect\src\index.js
  • H:\Github\angular-pro-sidebar\node_modules@angular\cli\models\architect-command.js
  • H:\Github\angular-pro-sidebar\node_modules@angular\cli\commands\build-impl.js
  • H:\Github\angular-pro-sidebar\node_modules@angular-devkit\schematics\tools\export-ref.js
  • H:\Github\angular-pro-sidebar\node_modules@angular-devkit\schematics\tools\index.js
  • H:\Github\angular-pro-sidebar\node_modules@angular\cli\utilities\json-schema.js
  • H:\Github\angular-pro-sidebar\node_modules@angular\cli\models\command-runner.js
  • H:\Github\angular-pro-sidebar\node_modules@angular\cli\lib\cli\index.js
  • C:\Users\Leo\AppData\Roaming\npm\node_modules@angular\cli\lib\init.js
  • C:\Users\Leo\AppData\Roaming\npm\node_modules@angular\cli\bin\ng at Function.Module._resolveFilename (internal/modules/cjs/loader.js:793:17) at Function.Module._load (internal/modules/cjs/loader.js:686:27) at Module.require (internal/modules/cjs/loader.js:848:19) at require (internal/modules/cjs/helpers.js:74:18) at Object.sassLoader (H:\Github\angular-pro-sidebar\node_modules\sass-loader\lib\loader.js:46:72)

and then I run 'npm install sass-loader node-sass webpack --save-dev', it showed: ERROR in ./src/styles.scss (./node_modules/@angular-devkit/build-angular/src/angular-cli-files/plugins/raw-css-loader.js!./node_modules/postcss-loader/src??embedded!./node_modules/sass-loader/dist/cjs.js??ref--14-3!./src/styles.scss) Module build failed (from ./node_modules/sass-loader/dist/cjs.js): ValidationError: Invalid options object. Sass Loader has been initialized using an options object that does not match the API schema.

  • options has an unknown property 'includePaths'. These properties are valid: object { implementation?, sassOptions?, prependData?, sourceMap?, webpackImporter? } at validate (H:\Github\angular-pro-sidebar\node_modules\sass-loader\node_modules\schema-utils\dist\validate.js:85:11) at Object.loader (H:\Github\angular-pro-sidebar\node_modules\sass-loader\dist\index.js:36:28) ERROR in ./src/app/app.component.scss Module build failed (from ./node_modules/sass-loader/dist/cjs.js): ValidationError: Invalid options object. Sass Loader has been initialized using an options object that does not match the API schema.
  • options has an unknown property 'includePaths'. These properties are valid: object { implementation?, sassOptions?, prependData?, sourceMap?, webpackImporter? } at validate (H:\Github\angular-pro-sidebar\node_modules\sass-loader\node_modules\schema-utils\dist\validate.js:85:11) at Object.loader (H:\Github\angular-pro-sidebar\node_modules\sass-loader\dist\index.js:36:28) ERROR in ./src/app/sidebar/sidebar.component.scss Module build failed (from ./node_modules/sass-loader/dist/cjs.js): ValidationError: Invalid options object. Sass Loader has been initialized using an options object that does not match the API schema.
  • options has an unknown property 'includePaths'. These properties are valid: object { implementation?, sassOptions?, prependData?, sourceMap?, webpackImporter? } at validate (H:\Github\angular-pro-sidebar\node_modules\sass-loader\node_modules\schema-utils\dist\validate.js:85:11) at Object.loader (H:\Github\angular-pro-sidebar\node_modules\sass-loader\dist\index.js:36:28)

Could you please help me out with this ?

839928622 avatar Jan 25 '20 23:01 839928622

Try re-compiling sass files.

npm rebuild node-sass --force

if doesn't work

npm install node-sass`

And try again. =)

ALEXOTANO avatar Jan 26 '20 01:01 ALEXOTANO

thank you so much , It works .

839928622 avatar Jan 26 '20 01:01 839928622

C:\work\projects\angular-pro-sidebar-gh-pages>ng serve Your global Angular CLI version (8.3.24) is greater than your local version (7.1.2). The local Angular CLI version is used.

To disable this warning use "ng config -g cli.warnings.versionMismatch false". **Schema validation failed with the following errors: Data path ".builders['app-shell']" should have required property 'class'. Error: Schema validation failed with the following errors: Data path ".builders['app-shell']" should have required property 'class'. at MergeMapSubscriber.project (C:\work\projects\angular-pro-sidebar-gh-pages\node_modules@angular-devkit\core\src\workspace\workspace.js:215:42) at MergeMapSubscriber._tryNext (C:\work\projects\angular-pro-sidebar-gh-pages\node_modules\rxjs\internal\operators\mergeMap.js:69:27) at MergeMapSubscriber._next (C:\work\projects\angular-pro-sidebar-gh-pages\node_modules\rxjs\internal\operators\mergeMap.js:59:18) at MergeMapSubscriber.Subscriber.next (C:\work\projects\angular-pro-sidebar-gh-pages\node_modules\rxjs\internal\Subscriber.js:67:18) at MergeMapSubscriber.notifyNext (C:\work\projects\angular-pro-sidebar-gh-pages\node_modules\rxjs\internal\operators\mergeMap.js:92:26) at InnerSubscriber._next (C:\work\projects\angular-pro-sidebar-gh-pages\node_modules\rxjs\internal\InnerSubscriber.js:28:21) at InnerSubscriber.Subscriber.next (C:\work\projects\angular-pro-sidebar-gh-pages\node_modules\rxjs\internal\Subscriber.js:67:18) at MapSubscriber._next (C:\work\projects\angular-pro-sidebar-gh-pages\node_modules\rxjs\internal\operators\map.js:55:26) at MapSubscriber.Subscriber.next (C:\work\projects\angular-pro-sidebar-gh-pages\node_modules\rxjs\internal\Subscriber.js:67:18) at SwitchMapSubscriber.notifyNext (C:\work\projects\angular-pro-sidebar-gh-pages\node_modules\rxjs\internal\operators\switchMap.js:86:26)

sameerrede avatar Feb 05 '20 18:02 sameerrede