ERROR in multi webpack-dev-server/client?http://localhost:4200

Question

problem

• i ran angular cli issue when i ran
  1. npm start or
  2. ng serve.

error :webpack: Failed to compile.

ng version

@angular/cli: 1.1.0
node: 6.11.0
os: win32 x64
@angular/animations: 4.2.6
@angular/common: 4.2.6
@angular/compiler: 4.2.6
@angular/core: 4.2.6
@angular/forms: 4.2.6
@angular/http: 4.2.6
@angular/platform-browser: 4.2.6
@angular/platform-browser-dynamic: 4.2.6
@angular/router: 4.2.6
@angular/cli: 1.1.0
@angular/compiler-cli: 4.2.6
@angular/language-service: 4.2.6

node version v6.11.0

 D:\Angular2DevApp>npm version
 { 'angular2-dev-app': '0.0.0',
  npm: '5.2.0',
  ares: '1.10.1-DEV',
  http_parser: '2.7.0',
  icu: '58.2',
  modules: '48',
  node: '6.11.0',
  openssl: '1.0.2k',
  uv: '1.11.0',
  v8: '5.1.281.102',
  zlib: '1.2.11' }

• i have installed fresh app to work with.

• any suggestion is most welcome.

error image:

• second image when i tried npm start

Answer 1

Try this: In your webpack config, add the following plugin and loader:

import {AotPlugin} from '@ngtools/webpack'

exports = { /* ... */
  module: {
    rules: [
      {
        test: /\.ts$/,
        loader: '@ngtools/webpack',
      }
    ]
  },

  plugins: [
    new AotPlugin({
      tsConfigPath: 'path/to/tsconfig.json',
      entryModule: 'path/to/app.module#AppModule'
    })
  ]
}

The loader works with the webpack plugin to compile your TypeScript. It's important to include both, and to not include any other TypeScript compiler loader.

Answer 2

From a GitHub issue : First I uninstalled the old version of the CLI globally, cleared cache, and then installed the new version CLI globally, following these instructions:

npm uninstall -g angular-cli @angular/cli
npm cache clean
npm install -g @angular/cli@latest

And then I updated the app.