Angular 4 AOT with webpack

我正在使用angularpack 4與webpack 2 &試圖使用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'。Angular 4 AOT with webpack

這是我的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" 
    ] 
}

來源

2017-04-07 Dheeraj Agrawal

這些'ngfactory'文件應該已經自動創建執行構建過程中鏈 - 這將是AOT的結果。也許在https://angular.io/docs/ts/latest/cookbook/aot-compiler.html查看並查看你的構建命令和配置是否正確（搜索'ngc'） –

我認爲我不需要ngc在這裏，因爲我使用'@ ngtools/webpack' –

AOT不支持打字稿現在版本高於2.0.10。你需要確保。此外，您必須將一些角模塊（如http，平臺瀏覽器或內核）更改爲角度2 - 我使用版本2.4.0 - ，因爲2.0.10或更低版本的打字稿不支持它們！

來源

2017-04-07 15:56:06

現在使用2.4.0版本和[email protected]仍然是同樣的問題，你使用webpack的AOT？＆你可以在這裏粘貼你的package.json嗎？ –

「dependencies」：「@ angular/animations」：「^ 4.0.1」，「@ angular/common」：「2.4.0」，「@ angular/compiler」：「2.4.0」，「@ angular/core」：「2.4.0」，「@ angular/flex-layout」：「^ 2.0.0-beta.7」，「@ angular/forms」：「2.4.0」，「 @ angular/http「：」2.4.0「，」@ angular/material「：」^ 2.0.0-beta.2「，」@ angular/platform-browser「：」2.4.0「，」@角度/平臺瀏覽器動態「：」2.4.0「，」@ angular/router「：」3.4.0「，」core-js「：」2.4.1「，」font-awesome「：」「4.7.0」，「hammerjs」：「^ 2.0.8」，「primeng」：「^ 2.0.3」，「rxjs」：「^ 5.3.0」，「zone.js」：「^ 0.7.8」 –

「@ angular/cli」：「1.0.0-rc.1」，「@ angular/compiler- cli「：」^ 2.4.0「，」@ types/jasmine「：」2.5.38「，」@ types/node「：」〜6.0。「茉莉花 - 核心」：「〜2.5.2」，「jasmine-spec-reporter」：「〜3.2.0」，「因果報應」：「〜2.0.0」，「codelyzer」：「〜2.0.0」，「「〜1.4.1」，「karma-chrome-launcher」：「〜2.0.0」，「karma-cli」：「〜1.0.1」，「karma-jasmine」：「〜1.1.0」，「karma-jasmine-html-reporter」：「^ 0.2.2」，「karma-coverage-istanbul-reporter」：「^ 0.2.0」，「karma-mocha-reporter」：「^ 2.2。 3「，」量角器「：」〜5.1.0「，」ts-node「：」〜2.0.0「，」tslint「：」〜4.5.0「，」typescript「：」2.0.10 「（Devdependencies） –

我有一個類似的錯誤與$$_gendir

每this post從構建命令CLI刪除--bail使我看到更多的錯誤消息，因爲$$_gendir錯誤更造成在生產前的錯誤的通用消息。

來源

2017-05-22 22:14:30

首先：您需要使用@ ngtools/webpack進行編譯。然後你的編譯器選項並不像Angular期望的那樣。

請確保您根據Official Angular AOT Cookbook

例如配置設置和tsconfig.json模塊屬性需要設置爲：

"module": "es2015"

此外，你應該告訴NGC在那裏把生成的源通過指定

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

來源

2017-06-26 11:13:56 Robert

Angular 4 AOT with webpack

回答

相關問題