无法重新声明块作用域变量 'AppRoutes'

Cannot redeclare block-scoped variable 'AppRoutes'

我正在尝试将我的 angular 应用程序路径拆分为 3 个清晰的部分。

  1. App-Router 模块 => 让它加载应用范围模块路由。 (目前我有 1 个范围作为“setup-config”)
  2. 让 Scope-Module 处理功能模块。 (目前我有2个功能模块)

  3. 让功能模块处理它自己的功能组件。

清晰和可重新调整的原因我正在努力实现这一目标。但出现错误 "Cannot redeclare block-scoped variable 'AppRoutes'."

有人帮我解决这个问题吗?如果我尝试的方法是错误的,谁能告诉我正确的方法吗?

Here is the live demo

在您的 app.routes.ts 文件中,您将 AppRoutes 作为 Routes 数组的名称 以及您的 class 名称文件。考虑重命名 Routes 数组的名称。

import { NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router';
import { CommonModule } from '@angular/common';
import { ScopeModule } from './setup-config/setup-config.module';

const AppRoutes: Routes = [ // This is called AppRoutes

 {
    path:"",
    pathMatch:"full",
    loadChildren:() => import('./setup-config/setup-config.module').then(m => m.ScopeModule)
  }

]

@NgModule({
    declarations: [],
    imports: [
        CommonModule,
        ScopeModule,
        RouterModule.forRoot(AppRoutes, { 
          scrollPositionRestoration: 'enabled',
          useHash: true
        })
    ],
    exports: []
})
export class AppRoutes { } // This is **also** called AppRoutes

您在文件中 AppRoutes 声明了两次。你可能应该说出一个 appRoutes:

const appRoutes: Routes = [{
  path:"",
  pathMatch:"full",
  loadChildren:() => import('./setup-config/setup-config.module').then(m => m.ScopeModule)
}]

@NgModule({
  declarations: [],
  imports: [
    CommonModule,
    ScopeModule,
    RouterModule.forRoot(appRoutes, { 
      scrollPositionRestoration: 'enabled',
      useHash: true
    })
  ],
  exports: []
})
export class AppRoutes {}

working stackblitz

working one with routing