多webpack-dev-server / client中出现错误？http：// localhost：4200

Question

问题

• 我跑步时跑了角度cli问题
  1. npm start或
  2. ng服务。

错误：webpack：编译失败。

ng版本

@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

节点版本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' }

• 我已经安装了新鲜的应用程序。

• 任何建议都是最欢迎的。

错误图片：

• 我尝试npm start时的第二张图片

Answer 1

尝试以下操作：在您的webpack配置中，添加以下插件和加载器：

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'
    })
  ]
}

加载程序与webpack插件一起编译您的TypeScript。 重要的是要同时包含两者，并且不包含任何其他TypeScript编译器加载器。

Answer 2

从GitHub问题开始 ：首先，按照以下说明，在全局范围内卸载旧版本的CLI，清除缓存，然后在全局范围内安装新版本的CLI：

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

然后我更新了应用程序。