angular-cli: ng serve --open always gives issue (webpack: Failed to compile.)

Created App By ng new, successfull, but running by ng serve always a pain

ERROR in multi webpack-dev-server/client?http://localhost:4200 ./src/main.ts
Module not found: Error: Can't resolve 'webpack-dev-server/client?http://localho
st:4200' in 'D:\javascript\angular2\HelloWord'
 @ multi webpack-dev-server/client?http://localhost:4200 ./src/main.ts

ERROR in multi ./src/styles.css
Module not found: Error: Can't resolve 'style-loader' in 'D:\javascript\angular2
\HelloWord'
 @ multi ./src/styles.css

ERROR in multi webpack-dev-server/client?http://localhost:4200 ./src/main.ts
Module not found: Error: Can't resolve '@ngtools/webpack' in 'D:\javascript\angu
lar2\HelloWord'
 @ multi webpack-dev-server/client?http://localhost:4200 ./src/main.ts

ERROR in multi ./src/polyfills.ts
Module not found: Error: Can't resolve '@ngtools/webpack' in 'D:\javascript\angu
lar2\HelloWord'
 @ multi ./src/polyfills.ts

ERROR in   Error: Child compilation failed:
  Entry module not found: Error: Can't resolve 'raw-loader' in 'D:\javascript\an
  gular2\HelloWord':
  Error: Can't resolve 'raw-loader' in 'D:\javascript\angular2\HelloWord'

  - compiler.js:76
    [HelloWord]/[cli]/[html-webpack-plugin]/lib/compiler.js:76:16

  - Compiler.js:280 Compiler.<anonymous>
    [HelloWord]/[cli]/[webpack]/lib/Compiler.js:280:10

  - Compiler.js:480
    [HelloWord]/[cli]/[webpack]/lib/Compiler.js:480:13

  - Tapable.js:138 next
    [HelloWord]/[cli]/[webpack]/[tapable]/lib/Tapable.js:138:11

  - CachePlugin.js:62 Compiler.<anonymous>
    [HelloWord]/[cli]/[webpack]/lib/CachePlugin.js:62:5

  - Tapable.js:142 Compiler.applyPluginsAsyncSeries
    [HelloWord]/[cli]/[webpack]/[tapable]/lib/Tapable.js:142:13

  - Compiler.js:477
    [HelloWord]/[cli]/[webpack]/lib/Compiler.js:477:10

  - Tapable.js:131 Compilation.applyPluginsAsyncSeries
    [HelloWord]/[cli]/[webpack]/[tapable]/lib/Tapable.js:131:46

  - Compilation.js:640 self.applyPluginsAsync.err
    [HelloWord]/[cli]/[webpack]/lib/Compilation.js:640:19

  - Tapable.js:131 Compilation.applyPluginsAsyncSeries
    [HelloWord]/[cli]/[webpack]/[tapable]/lib/Tapable.js:131:46

  - Compilation.js:631 self.applyPluginsAsync.err
    [HelloWord]/[cli]/[webpack]/lib/Compilation.js:631:11

  - Tapable.js:131 Compilation.applyPluginsAsyncSeries
    [HelloWord]/[cli]/[webpack]/[tapable]/lib/Tapable.js:131:46

  - Compilation.js:626 self.applyPluginsAsync.err
    [HelloWord]/[cli]/[webpack]/lib/Compilation.js:626:10

  - Tapable.js:131 Compilation.applyPluginsAsyncSeries
    [HelloWord]/[cli]/[webpack]/[tapable]/lib/Tapable.js:131:46

  - Compilation.js:622 sealPart2
    [HelloWord]/[cli]/[webpack]/lib/Compilation.js:622:9

  - Tapable.js:131 Compilation.applyPluginsAsyncSeries
    [HelloWord]/[cli]/[webpack]/[tapable]/lib/Tapable.js:131:46


webpack: Failed to compile.

Versions.

@angular/cli: 1.0.0-rc.2 node: 6.9.2 os: win32 x64 @angular/common: 2.4.9 @angular/compiler: 2.4.9 @angular/core: 2.4.9 @angular/forms: 2.4.9 @angular/http: 2.4.9 @angular/platform-browser: 2.4.9 @angular/platform-browser-dynamic: 2.4.9 @angular/router: 3.4.9 @angular/cli: 1.0.0-rc.2 @angular/compiler-cli: 2.4.9

About this issue

Original URL
State: closed
Created 7 years ago
Comments: 16 (2 by maintainers)

Most upvoted comments

I have the same problem too

+15

w4songwang on Mar 15, 2017

run this for the kendo errors

npm install --save @progress/kendo-angular-l10n@^0.2.0

Tyshark9 on Apr 4, 2017

@angular/cli: 1.0.0-rc.4 node: 6.10.0 os: win32 x64 @angular/common: 2.4.10 @angular/compiler: 2.4.10 @angular/core: 2.4.10 @angular/forms: 2.4.10 @angular/http: 2.4.10 @angular/platform-browser: 2.4.10 @angular/platform-browser-dynamic: 2.4.10 @angular/router: 3.4.10 @angular/cli: 1.0.0-rc.4 @angular/compiler-cli: 2.4.10

Maybe it will be useful for someone else. I have same errors when using ng serve, ng build.

I tried all instructions from other related issues (also properly reinstalled all globally). I was confused when get same error in docker container too (Linux image).

I solved problem by using yarn as default package manager for angular-cli.

npm install yarn -g
ng set --global packageManager=yarn

zartdinov on Mar 21, 2017

I am getting the following error : what could be the issue ? i’ve tried everything here

`ERROR in C:/Users/Udit/yatrum/src/app/components/trips/trip-detail/trip-detail.component.ts (14,26): Cannot find module 'ng2-cable/js/index'.

ERROR in C:/Users/Udit/yatrum/src/app/components/trips/trip-detail/trip-detail.component.ts (17,29): Cannot find module 'ng2-cable/js/index'.

ERROR in C:/Users/Udit/yatrum/src/app/components/trips/trip-detail/trip-detail.module.ts (9,39): Cannot find module 'ng2-cable/js/index'.

ERROR in Error encountered resolving symbol values statically. Could not resolve ng2-cable/js/index relative to C:/Users/Udit/yatrum/src/app/components/trips/trip-detail/trip-detail.module.ts., resolving symbol TripDetailModule in C:/Users/Udit/yatrum/src/app/components/trips/trip-detail/trip-detail.module.ts, resolving symbol TripDetailModule in C:/Users/Udit/yatrum/src/app/components/trips/trip-detail/trip-detail.module.ts

ERROR in ./src/main.ts
Module build failed: TypeError: Cannot read property 'newLine' of undefined
    at Object.getNewLineCharacter (C:\Users\Udit\yatrum\node_modules\typescript\lib\typescript.js:9426:20)
    at Object.createCompilerHost A(C:\Users\Udit\yatrum\node_modules\typescript\lib\typescript.js:62475:26)
    at Object.ngcLoader (C:\Users\Udit\yatrum\node_modules\@ngtools\webpack\src\loader.js:202:31)
 @ multi webpack-dev-server/client?http://localhost:4200 `./src/main.ts``

uditguru on Jul 10, 2017