Я использую angular-cli
для разработки, и я использовал следующие команды и код для создания моего проекта.
npm install angular-cli
(angular -cli: 1.0.0-beta.10)
ng new my-app
ng g component lazy-me
Затем добавлен файл app.router.ts
со следующим script
import { provideRouter, RouterConfig } from '@angular/router';
import { AppComponent } from './app.component';
// import { LazyMeComponent } from './+lazy-me/lazy-me.component';
const appRoutes : RouterConfig = [
{path: '', component: AppComponent},
// {path: 'lazyme', component: LazyMeComponent}
{path: 'lazyme', component: 'app/+lazy-me#LazyMeComponent'}
];
export const APP_ROUTER_PROVIDER = [
provideRouter(appRoutes)
];
И изменил мой main.ts следующим образом
import { bootstrap } from '@angular/platform-browser-dynamic';
import { enableProdMode,
SystemJsComponentResolver,
ComponentResolver } from '@angular/core';
import {RuntimeCompiler} from '@angular/compiler';
import { AppComponent, environment } from './app/';
import { APP_ROUTER_PROVIDER } from './app/app.router';
if (environment.production) {
enableProdMode();
}
bootstrap(AppComponent,[
APP_ROUTER_PROVIDER,
{
provide: ComponentResolver,
useFactory: (r) => new SystemJsComponentResolver(r),
deps: [RuntimeCompiler]
},
]);
И для создания сборки я использовал следующую команду
ng build -prod
Когда я развертываю свой код на веб-сервере и перехожу к пути lazyme
, я получаю ошибку 404 для app/lazy-me/lazy-me.component.js
Папка существует, но lazy-me.component.js
отсутствует как ожидалось, так как все вставляется в main.js
, за исключением файлов .css и .html.
Однако я хочу, чтобы ng build -prod
включал lazy-me.component.js
в dist/app/lazy-me/
.
Есть ли какие-либо настройки в system-config.ts
или где-нибудь еще, где я могу включить ленивые загружаемые компоненты в состав dist
при создании -prod
build?