Angular 6路由报错：RouterModule.forRootd不是函数的问题求助

先解答你的第一个疑问：CLI 6的路由模块生成方式是正常的 #

没错，Angular CLI 6确实调整了路由模块的默认生成逻辑——旧版本会自动创建一个带有@NgModule装饰器的独立路由模块（比如AppRoutingModule），但从CLI 6开始，默认生成的路由文件（就是你手里的app-routing.ts）会直接导出RouterModule.forRoot(routes)的结果，不再额外包裹@NgModule。这是官方的正常改动，完全符合新的CLI规范，不用纠结这个点。

关于你遇到的报错：明显是拼写失误！ #

你看到的报错：

Uncaught TypeError: angular_router__WEBPACK_IMPORTED_MODULE_0_.RouterModule.forRootd is not a function

里面的forRootd多了一个字母d！这绝对是拼写错误。

你贴出来的app-routing.ts代码最后一行是正确的RouterModule.forRoot(routes)，那大概率是你实际运行的代码里不小心打错了，或者复制粘贴时出了问题。先去检查你的本地代码，确保是forRoot而不是forRootd，这个拼写错误是报错的核心原因。

另外，结合你更新的app-shared.module.ts代码，还有两个小细节可以优化：

1. 导入路径匹配：你写的import { AppRoutes } from './app.routing';，但你的路由文件是app-routing.ts，Angular对文件名大小写和后缀（虽然.ts可以省略）是敏感的，确认路径和实际文件名完全一致，避免导入错误。
2. 模块导入顺序与冗余：BrowserModule已经包含了CommonModule的所有功能，在根模块里只需要导入BrowserModule就够了，不需要重复导入CommonModule。而且BrowserModule通常要放在导入列表的最前面。

调整后的app-shared.module.ts导入部分可以改成这样：

imports: [
  BrowserModule,
  TodoModule,
  HttpClientModule,
  FormsModule,
  AppRoutes
],

总结修复步骤 #

• 立即检查app-routing.ts中的RouterModule.forRoot()拼写，把错误的forRootd改成正确的forRoot。
• 确认路由文件的导入路径和实际文件名完全匹配（包括大小写）。
• 清理根模块里的冗余导入，调整导入顺序。

按照上面的步骤操作，你的报错应该就能解决了！

内容的提问来源于stack exchange，提问作者Sami-L