Ich entwickle eine Ionic 3/Angular 4 App mit Cordova. Wir müssen in der Lage sein, Module/Komponenten unabhängig von der App zu erstellen, um z. Informationsseiten. Ich habe diese Zeilen lesen:Angular - dynamisches Modul laden und kompilieren
gesagt, ich versuche zu tun, was der Autor hat unter
dynamic component loading and compilation
@ViewChild('vc', {read: ViewContainerRef}) _container: ViewContainerRef;
System.import('http://localhost:8080/path/to/js/file.js').then((module) => {
this._compiler.compileModuleAndAllComponentsAsync(module.ExampleModule)
.then((compiled) => {
const factory = compiled.componentFactories[0];
this._container.createComponent(factory);
})
})
Dieses arbeitet an Github gefunden in der Beispielanwendung in.
Aber soweit ich weiß, verwendet ionic/angular webpack und ich möchte Webpack nicht durch SystemJS ersetzen (wenn das überhaupt möglich ist). Ich möchte nur die System.import() von SystemJS oder eine ähnliche Sache mit Webpack verwenden. Und ich weiß einfach nicht, wie ich das konfigurieren soll.
Im Moment bin ich immer diese Fehlermeldung:
ERROR Error: Uncaught (in promise): Error: Cannot find module 'http://localhost:8080/path/to/js/file.js'.
Error: Cannot find module 'http://localhost:8080/path/to/js/file.js'.
at script-loader lazy:2
at new t (polyfills.js:3)
at webpackEmptyAsyncContext (script-loader lazy:2)
at ScriptLoaderProvider.webpackJsonp.333.ScriptLoaderProvider.loadScript (script-loader.ts:19)
at FlexiPage.webpackJsonp.112.FlexiPage.ionViewDidLoad (flexi.ts:38)
at ViewController._lifecycle (view-controller.js:566)
at ViewController._didLoad (view-controller.js:439)
at NavControllerBase._didLoad (nav-controller-base.js:950)
at t.invoke (polyfills.js:3)
at Object.onInvoke (core.es5.js:3890)
at script-loader lazy:2
at new t (polyfills.js:3)
at webpackEmptyAsyncContext (script-loader lazy:2)
at ScriptLoaderProvider.webpackJsonp.333.ScriptLoaderProvider.loadScript (script-loader.ts:19)
at FlexiPage.webpackJsonp.112.FlexiPage.ionViewDidLoad (flexi.ts:38)
at ViewController._lifecycle (view-controller.js:566)
at ViewController._didLoad (view-controller.js:439)
at NavControllerBase._didLoad (nav-controller-base.js:950)
at t.invoke (polyfills.js:3)
at Object.onInvoke (core.es5.js:3890)
at c (polyfills.js:3)
at c (polyfills.js:3)
at polyfills.js:3
at t.invokeTask (polyfills.js:3)
at Object.onInvokeTask (core.es5.js:3881)
at t.invokeTask (polyfills.js:3)
at r.runTask (polyfills.js:3)
at o (polyfills.js:3)
at HTMLElement.invoke (polyfills.js:3)
Es sieht aus wie es die Ressource nicht finden, aber ich denke, es ist eine Fehlkonfiguration mit SystemJS, wie es in der Beispielanwendung funktioniert. Das erste Problem, mit dem ich konfrontiert bin, ist, wie man SystemJS richtig in die Ionic App einfügt.
Wenn jemand etwas Einblick hat, würde ich es sehr schätzen.
Welche Version von Webpack verwenden Sie? Wenn Sie 'v3' verwenden, können Sie die Funktion' import() 'verwenden, wenn Sie den Modulnamen ** zur Build-Zeit ** kennen. Überprüfen Sie [this thread] (https://github.com/webpack/webpack/issues/3098). Ich habe SystemJS verwendet, weil der Modulname während der Bauzeit nicht bekannt war und das Webpack keine Module laden kann, die während der Erstellungszeit nicht bekannt sind. –
Danke für die schnelle Antwort, aber genau das muss ich implementieren. Die Module werden zum Zeitpunkt der Erstellung nicht bekannt sein. Vielleicht sollte ich lieber eine Frage ins ionische Forum stellen, wie man systemJS hinzufügt. – malua
dann können Sie Webpack nicht verwenden, um Module dynamisch zu laden. Sie müssen entweder SystemJS oder FuseBox verwenden –