错误：找不到模块“app/MyComponent/MyComponent.module”错误：找不到模块

Question

这与提到的here 非常相似，但是 cmets 或答案中提供的每个解决方案都没有解决我的问题。想看看还有什么我应该看的。我尝试了不同的路径，例如

• ./app/mycomponent/mycomponent.module#MyComponentModule,
• .mycomponent//mycomponent.module#MyComponentModule

但没有任何效果。我的问题和原始问题之间的最大区别是，我们最近添加了 webpack，那是应用程序崩溃的时候。当我们不使用任何捆绑服务（webpack）并且一切都是单独的文件时，一切都很好。 我的主页 home.module 也没有这个问题。其他所有页面或模块都会抛出完全相同的问题。在实现方面，家庭和其他模块之间实际上并没有太大区别。

我的路由模块有这个

{
    path: 'mycomponent',
    loadChildren: 'app/mycomponent/mycomponent.module#MyComponentModule'
}

下面的完全异常

bootstrap:51 ERROR 错误：未捕获（承诺中）：错误：找不到 模块'app/mycomponent/mycomponent.module'错误：找不到模块 'app/mycomponent/mycomponent.module' 在 browser.es5.js:91 在 ZoneDelegate.invoke (zone.js:392) 在 Object.onInvoke (animations.es5.js:7) 在 ZoneDelegate.invoke (zone.js:391) 在 Zone.run (zone.js:142) 在 zone.js:873 在 ZoneDelegate.invokeTask (zone.js:425) 在 Object.onInvokeTask (animations.es5.js:7) 在 ZoneDelegate.invokeTask (zone.js:424) 在 Zone.runTask (zone.js:192) 在 browser.es5.js:91 在 ZoneDelegate.invoke (zone.js:392) 在 Object.onInvoke (animations.es5.js:7) 在 ZoneDelegate.invoke (zone.js:391) 在 Zone.run (zone.js:142) 在 zone.js:873 在 ZoneDelegate.invokeTask (zone.js:425) 在 Object.onInvokeTask (animations.es5.js:7) 在 ZoneDelegate.invokeTask (zone.js:424) 在 Zone.runTask (zone.js:192) 在 resolvePromise (zone.js:824) 在 resolvePromise (zone.js:795) 在 zone.js:873 在 ZoneDelegate.invokeTask (zone.js:425) 在 Object.onInvokeTask (animations.es5.js:7) 在 ZoneDelegate.invokeTask (zone.js:424) 在 Zone.runTask (zone.js:192) 在 drainMicroTaskQueue (zone.js:602)

下面是我的 webpack 配置

const path = require('path');

module.exports = {   entry: './src/main.ts',  
devtool: 'source-map',  
module: {
    rules: [
      {
        test: /\.tsx?$/,
        loaders: ['ts-loader'],
        exclude: [/\.(spec|e2e)\.ts$/]
      },
      {
        test: /\.(html|css)$/, 
        loader: 'raw-loader',
        exclude: /\.async\.(html|css)$/
      }
    ]   },   
 resolve: {
    extensions: [ '.tsx', '.ts', '.js' ]   },   
 output: {
    filename: 'bundle.js',
    path: path.resolve(__dirname, 'dist')    } };

• 角度：4.3.6
• 打字稿：2.9.2

Answer 1

对于其他来这里的人..我无法弄清楚我的路径有什么问题..我的队友让它工作了..在路由模块中..我们改为

import { MyComponentModule } from './myComponentModule/MyComponent.module';

然后在加载中调用这个类名

{
    path: 'myComponent',
    loadChildren: ()=> MyComponentModule
},

虽然这行得通，但我不知道为什么旧版本不起作用，即使我给出了完全相同的路径。

Answer 2

您可以使用路由模块所在位置的相对路径：

{
    path: 'mycomponent',
    loadChildren: '../mycomponent/mycomponent.module#MyComponentModule'
}

Angular 6 似乎改变了要求，因此loadChildren 必须始终是相对的。我在将应用程序迁移到较新版本时遇到了这个问题。

在此处查看此更改：

https://github.com/angular/angular/commit/f44a2c730a84cd86695d1851395ad28423704bd0

更新后的文档现在说“相对”。