使用路由器加载Angular模块:错误找不到模块

Question

嘿所以我有一个非常奇怪的问题,我在设置角度路由之前没有遇到过,当我试图延迟加载另一个模块时,我不断收到此错误 Error: Cannot find module "app/feed/feed.module"

从这里开始是我的设置

• @ angular/cli:6.0.1
• @ angular/core:6.0.0
• @ angular/material:6.0.1
• npm:6.0.1
• 节点:10.1.0

另外需要注意的是,我刚刚更新了所有的全局npm软件包后生成了一个新的角度项目,因此列出的内容在我运行之前已经更新到了 ng new app-name

这是我的app-routing.module:

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

const rootRoutes: Routes = [
  { path: '', redirectTo: 'feed', pathMatch: 'full' },
  { path: 'feed', loadChildren: 'app/feed/feed.module#FeedModule' }
];

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

然后app.module我在上面导入这个模块:

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,
    BrowserAnimationsModule,
    AppRoutingModule
  ],
  providers: [],
  bootstrap: [AppComponent]
})

这是feed-routing.module:

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

import { FeedComponent } from './feed.component';
import { CreatePostComponent } from './create-post/create-post.component';

export const feedRoutes: Routes = [
  {
    path: '',
    component: FeedComponent,
    children: [
      { path: 'create', component: CreatePostComponent }
    ]
  }
];

@NgModule({
  imports: [RouterModule.forChild(feedRoutes)],
  exports: [RouterModule]
})
export class FeedRoutingModule { }

就像app.module我在我的导入该模块一样feed.module:

@NgModule({
  imports: [
    CommonModule,
    FeedRoutingModule
  ],
  declarations: [
    FeedComponent,
    CreatePostComponent
  ]
})

这是VSCode中我的探险家的一个小图片,只是为了验证我的模块位于正确的位置:

我一次又一次地使用这种方法,从未见过关于我的第二个模块没有被发现的错误,并想知道它是否与更新的Angular 6包有关.任何和所有的帮助非常感谢,因为我想在这个项目中懒惰加载各种模块.提前致谢!

Answer 1

对于那些,你无法从上面的评论中得到答案,使用@penleychan指定的以下语法

根据文档,你最终会写这样的东西

const rootRoutes: Routes = [
  { path: '', redirectTo: 'feed', pathMatch: 'full' },
  { path: 'feed', loadChildren: 'app/feed/feed.module#FeedModule' }
];

将此更改为

const rootRoutes: Routes = [
  { path: '', redirectTo: 'feed', pathMatch: 'full' },
  { path: 'feed', loadChildren: './feed/feed.module#FeedModule' }
];

注意两个代码示例中loadChildren属性的更改.如果尚未使用ng-cli创建应用程序,请确保loadChildren路径相对于app-routing.module.ts文件