找不到模塊'./sections/lazy/lazy.module.ngfactory'錯誤在Angular 2 Webpack + AOT設置

我一直在嘗試一段時間才能獲得一個懶惰的加載模塊在簡單的AOT + Webpack Angular 2建立。找不到模塊'./sections/lazy/lazy.module.ngfactory'錯誤在Angular 2 Webpack + AOT設置

以下是我的核心設置，如果有其他任何內容有助於創建更多上下文，請讓我知道，我會更新問題。

tsconfig.json

{ 
    "compilerOptions": { 
    "target": "es5", 
    "module": "commonjs", 
    "declaration": false, 
    "removeComments": true, 
    "noLib": false, 
    "emitDecoratorMetadata": true, 
    "experimentalDecorators": true, 
    "lib": ["dom", "es6"], 
    "sourceMap": true, 
    "pretty": true, 
    "allowUnreachableCode": false, 
    "allowUnusedLabels": false, 
    "noImplicitAny": true, 
    "noImplicitReturns": true, 
    "noImplicitUseStrict": false, 
    "noFallthroughCasesInSwitch": true, 
    "moduleResolution": "node", 
    "outDir": "build/tmp", 
    "typeRoots": [ 
     "./node_modules/@types" 
    ], 
    "types": [ 
     "node", 
     "jasmine" 
    ] 
    }, 
    "exclude": [ 
    "build", 
    "dist", 
    "node_modules", 
    "src/main.aot.ts", 
    "tmp" 
    ], 
    "angularCompilerOptions": { 
    "debug": true, 
    "genDir": "build", 
    "skipMetadataEmit": true 
    }, 
    "compileOnSave": false, 
    "buildOnSave": false 
}

app.routing.ts

import { NgModule } from '@angular/core'; 
import { Routes, RouterModule } from '@angular/router'; 

export const routes: Routes = [ 
    { path: 'lazy', loadChildren: './sections/lazy/lazy.module#RecipesModule' }, 
]; 

@NgModule({ 
    imports: [RouterModule.forRoot(routes)], 
    exports: [RouterModule], 
}) 
export class AppRoutingModule { }

webpack.prod.js

// ... 
module: { 
    rules: [ 
    { 
     test: /\.ts$/, 
     loader: '@ngtools/webpack', 
    } 
    ] 
} 
// ... 
plugins: [ 
    // ... 
    new AotPlugin({ 
    tsConfigPath: './tsconfig.json', 
    entryModule: helpers.root('src/app/app.module#AppModule') 
    }), 
    // ... 
] 
// ...

的構建過程完成後沒有任何問題，但是當我嘗試導航到/lazy網址時發生錯誤Error: Uncaught (in promise): Error: Cannot find module './sections/lazy/lazy.module.ngfactory'.。

同時在開發/ JIT中運行應用程序沒有任何問題。

您是否發現任何問題？

感謝

來源

2017-05-10 crash

同樣的問題與我們的樣本回購[這裏]（https://github.com/BrainCrumbz/ngtools-webpack-demo）。還有一個[分支]（https://github.com/BrainCrumbz/ngtools-webpack-demo/tree/feat/jit-entry-point），使用JiT入口點代替AoT入口點。兩種情況都沒有運氣。 – superjos

嗨@superjos我發佈了一個答案，可能會解決你的問題，因爲你在你的webpack配置中使用相同的插件，希望它可以幫助 – crash

我通過我是用我的WebPack構建除去ContextReplacementPlugin解決了這個問題。

我在我的webpack.config文件以下plugin條目是造成問題：

// Workaround for angular/angular#11580 
new ContextReplacementPlugin(
    // The (\\|\/) piece accounts for path separators in *nix and Windows 
    // https://github.com/angular/angular.io/issues/3514 
    /angular(\\|\/)core(\\|\/)@angular/, 
    helpers.root('src'), // location of your src 
    {} // a map of your routes 
),

我的項目配置是基於angular-starter repo和我可能無法正確使用ContextReplacementPlugin插件。

來源

2017-05-11 10:24:27 crash

感謝您的輸入。我嘗試了這個項目，評論了那個插件入口，但沒有任何改變。仍然打*錯誤：找不到模塊'../private/module.ngfactory'.*。不知道如何可以幫助，對於角度項目，它建議在各地。 – superjos

找不到模塊'./sections/lazy/lazy.module.ngfactory'錯誤在Angular 2 Webpack + AOT設置

回答

相關問題