Отложенная загрузка Angular 2 NgModule в модуль NPM с помощью angular router

#angular #angular2-routing #angular-cli

#angular #angular2-маршрутизация #angular-cli

Вопрос:

Я лениво загружал модули в маршрутах, например

 export const HomeRoute: Route = {
  path: '',
  component: HomeComponent,
  canActivate: [AuthGuard],
  children: [
    {path: 'dashboard', loadChildren: 'app/ dashboard/db.module#DashboardModule'}
  ]
};

Я хотел бы поместить свои «страницы» в модули NPM. Какой маршрут к node_module я должен использовать в атрибуте loadChildren? Я использую angular-cli 1.0.0-beta.16

Я пробовал

 {path: 'lazy', loadChildren: '../node_modules/hello-world/components#HelloWorld' }

также

 {path: 'lazy', loadChildren: 'hello-world/components#HelloWorld' }

Экспортируемый класс: —

 import {Component} from '@angular/core';

@Component({
    selector: 'hello-world',
    styles: [`
       h1 {
            color: blue;
        }
    `],
    template: `<div>
                  <h1 (click)="onClick()">{{message}}</h1>
               </div>`
})
export class HelloWorld {

    message = "Click Me ...";

    onClick() {
        this.message = "Hello World!";
        console.log(this.message);

    }
}

Есть ли что-нибудь еще, что я должен попробовать?

Ответ №1:

В настоящее время это невозможно — смотрите Ответ от команды AngularJS CLI здесь: —

https://github.com/angular/angular-cli/issues/2601

«Это очень актуальный вопрос. Я не думаю, что мы поддерживаем это в CLI atm «. (В настоящее время бета-версия 17)

Datumgeek реализовал отложенную загрузку из модулей другим способом (вне CLI) здесь: — https://github.com/datumgeek/a2dyn/blob/master/README.md#development-server

Я обновлю ответ, если это станет возможным в Angular CLI в будущем

1. Знаете ли вы, возможно ли это сделать без CLI? Т.е. На основе angular webpack starter из angularclass? Я попытался подключиться к своим модулям через ‘../node_modules /path_to_my_module’, и единственное, что не работает, это компиляция AOT.

2. Обходной путь можно найти здесь (один из комментариев примерно в конце проблемы): github.com/angular/angular-cli/issues/6373 , но это не ленивая загрузка и не поддержка компиляции AOT.

Ответ №2:

убедитесь, что HelloWorld является экспортируемым классом, а не «экспортом по умолчанию». в противном случае это не сработает.

1. Прошу прощения за задержку, я был в отпуске. Да, класс HelloWorld только что экспортирован, я отредактировал вопрос, чтобы показать класс полностью

2. Возможно, проблема в том, что angular-cli не предоставляет конфигурацию webpack, поскольку здесь упоминается, что ему приходилось использовать webpack напрямую, а не CLI github.com/datumgeek/a2dyn/blob/master /…