Angular:延迟加载模块仅适用于开发(environment.production === false)

Question

我有一个延迟加载的模块仅用于开发目的，我不想将其部署到生产版本中。

有了警卫，我拒绝了激活和加载：

const routes: Routes = [
  {
    path: 'dev',
    loadChildren: './features/dev/dev.module#DevModule',
    canActivate: [DevelopmentGuard],
    canLoad: [DevelopmentGuard]
  },
];
@NgModule({
  imports: [RouterModule.forRoot(routes)],
  exports: [RouterModule]
})
export class AppRoutingModule { }

卫兵：

@Injectable({
  providedIn: 'root'
})
export class DevelopmentGuard implements CanActivate, CanLoad {
  constructor() {}
  canActivate(next: ActivatedRouteSnapshot, state: RouterStateSnapshot): boolean {
    return this.can();
  }
  canActivateChild(childRoute: ActivatedRouteSnapshot, state: RouterStateSnapshot): boolean {
    return this.can();
  }
  canLoad(route: Route, segments: UrlSegment[]): boolean {
    return this.can();
  }
  private can(): boolean {
    return (environment.production === false);
  }
}

它有效，我的开发模块仅适用于开发，但开发模块的脚本在构建中。

有没有办法从生产版本的构建中完全删除脚本？

Answer 1

选项 1

let routes: Routes = []; // provide default rotes
if(!environment.production){
   routes = [...routes, [  {
    path: 'dev',
    loadChildren: './features/dev/dev.module#DevModule',
    canActivate: [DevelopmentGuard],
    canLoad: [DevelopmentGuard]
  },
]]
}

选项 2.

export let devRoutes: Routes = [];
if(!environment.production){
   devRoutes = [  {
    path: 'dev',
    loadChildren: './features/dev/dev.module#DevModule',
    canActivate: [DevelopmentGuard],
    canLoad: [DevelopmentGuard]
  }
 ]
}
RouterModule.forRoot([...routes, ...devRoutes])

使用选项 2，如果将 devRoutes 移动到环境配置，则可以使其变得更好