Fehler beim Versuch, Feature-Module mit angular-cli mit Webpack zu laden
Hi Ich versuche angular-cli mit webpack (+ produktivität) zu verwenden, um meine angular2-App zu erstellen, aber ich habe Probleme, wenn ich Module laden möchte, die mit Version beta.10 arbeiten ...
>Projektstruktur:
package.json
%Vor%angular-cli.json
%Vor%tsconfig.json
%Vor%app.routes.ts
%Vor%app.module.ts
%Vor%module / home / home.routes.ts
%Vor%module / home / home.module.ts
%Vor% Konsolenfehlermeldung:
Gibt es irgendetwas, das ich hier vergesse? Ich konnte nirgendwo eine Dokumentation darüber finden, wie ich damit verfahren soll ... Vielen Dank im Voraus!
3 Antworten
Dafür gibt es einen Loader ( angular2-router-loader ). Sie können es jedoch nicht mit der CLI verwenden, ohne die Konfiguration zu hacken. Glücklicherweise funktioniert es6-promise-loader mit der CLI out-of-the-box.
Das hat für mich geklappt:
Zuerst brauchen wir den es6-promise-loader:
npm i --save-dev es6-promise-loader
Definieren Sie dann Ihre Route wie folgt:
{path:"lazy", loadChildren: () => require('es6-promise!./path/to/module')('ClassName')}
Das es6-promise-loader ersetzt das obige mit:
Dies ist der richtige Weg, um ein Modul mit dem Webpack zu laden, aber es ist mühsam, es in jede Route einzufügen.
Angular-cli hat das Build-System zwischen Beta.10 und Beta.14 von SystemJS auf Webpack umgestellt.
Ich habe versucht, lazy loading mit angular-cli (beta.17) und es hat für mich funktioniert.
Nach meinem Verständnis
SystemJs - Wir müssen vollständigen Pfad für das verzögerte Laden angeben Beispiel: ./ app / dashboard / dashboard.module # DashboardModule
Webpack - wir müssen relativen Pfad für das verzögerte Laden angeben Beispiel: ./ dashboard / dashboard.module # DashboardModule
Hinweis: Vergessen Sie nicht, den Server neu zu starten, damit die Änderungen angezeigt werden. (ng serve)
Diese kleine Beobachtung hat mein Problem behoben. Bitte sehen Sie, ob das nützlich ist oder korrigieren Sie mich bei irgendetwas.
Tags und Links angular webpack lazy-loading angular-cli