Question

我正在使用角度4与webpack 2＆amp;试图使用AOT，但它给了我这个错误：10% building modules 4/5 modules 1 active ..._modules/intl/locale-data/jsonp/en.jsModuleNotFoundError: Module not found: Error: Can't resolve './../$$_gendir/src/app/app.module.ngfactory' in '/Users/xyz/angular-upgrade/backend/myapp/angular/src'。

这是我的webpack.config：

new AotPlugin({
  tsConfigPath: './tsconfig.json',
  entryModule: './src/app/app.module#AppModule'
}),

我用来构建的脚本是："build": "rimraf dist && webpack --config config/webpack.prod.js --progress --profile --bail"

以下是我的tsconfig.json：

{
  "compilerOptions": {
    "target": "es5",
    "module": "commonjs",
    "moduleResolution": "node",
    "sourceMap": true,
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "lib": ["es2015", "dom"],
    "noImplicitAny": false,
    "suppressImplicitAnyIndexErrors": true
  },
  "exclude": [
    "node_modules",
    "bower_components"
  ]
}

Answer 1

AOT现在不支持2.0.10以上的打字稿版本。你需要确保这一点。此外，你必须将一些角度模块，如http，平台浏览器或核心更改回角度2 - 我使用版本2.4.0 - ，因为版本2.0.10或更低版本的打字稿不支持它们！

Answer 2

首先：你需要使用@ ngtools / webpack进行编译。然后你的编译器选项不像Angular所希望的那样。

请确保根据Official Angular AOT Cookbook

配置您的设置和tsconfig.json

E.g。 module属性需要设置为：

"module": "es2015"

此外，您应该通过指定

告诉ngc将生成的源放在何处

"angularCompilerOptions": {
 "genDir": "aot",
 "skipMetadataEmit": true
}

Answer 3

我与$$_gendir

有类似的错误

每this post从构建命令cli中删除--bail使我能够看到更多错误消息，因为$$_gendir错误更多是由构建中的先前错误导致的一般消息。

Angular 4 AOT with webpack

3 个答案: