我将我的 Angular 项目从 6 迁移到 7,我正在使用延迟加载机制来加载模块。但是,当我使用 aot true 进行生产构建或为项目提供服务时,会ng serve --aot
出现以下错误。
错误:未捕获(承诺):错误:找不到模块'app/modules/home/home.module'错误:找不到模块'app/modules/home/home.module'
这是我的 package.json
{
"name": "web-app",
"version": "0.0.0",
"license": "MIT",
"scripts": {
"ng": "ng",
"start": "ng serve",
"build": "ng build",
"test": "ng test",
"lint": "ng lint",
"e2e": "ng e2e"
},
"private": true,
"dependencies": {
"@angular/animations": "~7.0.0",
"@angular/common": "~7.0.0",
"@angular/compiler": "~7.0.0",
"@angular/core": "~7.0.0",
"@angular/fire": "^5.1.0",
"@angular/forms": "~7.0.0",
"@angular/http": "~7.0.0",
"@angular/platform-browser": "~7.0.0",
"@angular/platform-browser-dynamic": "~7.0.0",
"@angular/router": "^7.0.2",
"@nicky-lenaers/ngx-scroll-to": "^2.0.0",
"angular-countries": "^1.1.5",
"angular-draggable-droppable": "^4.0.2",
"angular-mention": "0.0.5",
"angular-mentions": "^0.9.0",
"angular-text-input-autocomplete": "^0.3.0",
"bootstrap": "^4.1.3",
"core-js": "^2.5.3",
"enhanced-resolve": "^3.3.0",
"firebase": "^5.5.0",
"firebase-tools": "^7.0.2",
"isotope-layout": "^3.0.5",
"jquery": "^3.3.1",
"keyboardevent-key-polyfill": "^1.1.0",
"moment": "^2.19.3",
"ng-dynamic": "^3.0.2",
"ng-dynamic-component": "^4.0.0",
"ng2-nouislider": "^1.7.13",
"ng2-pdf-viewer": "^5.3.4",
"ngx-clipboard": "^8.1.4",
"ngx-cookie-service": "^2.1.0",
"ngx-image-cropper": "^1.3.9",
"ngx-img-cropper": "^7.0.3",
"ngx-infinite-scroll": "^7.1.0",
"ngx-moment": "^3.2.0",
"ngx-popover": "0.0.16",
"ngx-slick": "^0.2.1",
"ngx-toastr": "^9.1.1",
"node-pre-gyp": "^0.14.0",
"node-sass": "^4.10.0",
"nouislider": "^10.1.0",
"promise-polyfill": "6.0.2",
"rxjs": "^6.3.3",
"rxjs-compat": "^6.0.0-rc.0",
"twitter": "^1.7.1",
"web-animations-js": "^2.3.1",
"zone.js": "^0.8.26"
},
"devDependencies": {
"@angular-devkit/build-angular": "^0.12.3",
"@angular/cli": "~7.0.4",
"@angular/compiler-cli": "~7.0.0",
"@angular/language-service": "~7.0.0",
"@types/jasmine": "~2.8.8",
"@types/jasminewd2": "~2.0.3",
"@types/node": "~8.9.4",
"codelyzer": "~4.5.0",
"express": "^4.17.1",
"jasmine-core": "~2.99.1",
"jasmine-spec-reporter": "~4.2.1",
"karma": "~3.0.0",
"karma-chrome-launcher": "~2.2.0",
"karma-coverage-istanbul-reporter": "~2.0.1",
"karma-jasmine": "~1.1.2",
"karma-jasmine-html-reporter": "^0.2.2",
"path": "^0.12.7",
"protractor": "~5.4.0",
"ts-node": "~7.0.0",
"tslint": "~5.11.0",
"typescript": "~3.1.1"
}
}
这是我的 app.routing.module.ts
{
path: 'home',
loadChildren: 'app/modules/home/home.module#HomeModule'
},
{
path: 'top',
loadChildren: 'app/modules/top/top.module#TopModule'
},
{
path: 'story/:storyId',
loadChildren: 'app/modules/story/story.module#StoryModule'
},
{
path: '',
redirectTo: 'home',
pathMatch: 'full'
}
这是我的目录结构
Project
src
app
app.module.ts
app.routing.module.ts
modules
home
homedir.module.ts
最后这是我的 tsconfig
{
"compileOnSave": false,
"compilerOptions": {
"outDir": "./dist/out-tsc",
"sourceMap": true,
"declaration": false,
"moduleResolution": "node",
"emitDecoratorMetadata": true,
"experimentalDecorators": true,
"target": "es5",
"typeRoots": [
"node_modules/@types"
],
"lib": [
"es2017",
"dom"
],
"module": "es2015",
"baseUrl": "./"
}
}
使用 aot false 构建工作正常。但我真的需要解决这个问题。我也尝试过使用绝对路径和loadChildren: () => HomeModule
. 有什么建议么?