defer on type=systemjs-module for your use case. I would in general think that this would be unadvisable though since any delay = direct performance issues for the user (especially since these scripts aren't preloaded by the browser preloader as it does not understnad them).
1 reply
System.set should be set with full URLs usually if you can. prepareImport is just for loading the import map initially. Updating the import map after that prepareImport is a use case we have yet to support, but are currently matching what browser import maps provide.
4 replies
react and react-dom. The outer application is built using webpack, and I've got that happily putting the UMD builds of react/dom as script imports in the html file, but I'm not sure how I can tell systemjs that import React from 'react' is already provided and doesn't need fetching. Any ideas?
I have the following issue:
I'm loading a remote module using Angular & SystemJS
Hi all!
We're currently running an old version of SystemJS (0.20.19) and would like to upgrade to the newest version. One issue is that our app depends on external modules that uses System.registerDynamic(). These modules are loaded dynamically at runtime from an external URL (think: micro frontend setup).
I have tried to add hooks to map the registerDynamic calls to register, but without success. Is there any guide on how to do this and/or perhaps a way to transpile the module during import?
Oh and a separate but equally important question:
These dynamically loaded modules should re-use dependencies that are declared/loaded by our app (an Angular CLI app with webpack). In the past we have done this:
import * as rxjs from "rxjs";
SystemJS.set("rxjs", SystemJS.newModule(rxjs));Is there perhaps a way to hook into the System dependency resolution such that:
System.someModuleRequires(moduleName => {
if (moduleName === "rxjs") {
return import("rxjs"); // Import webpack bundle
} else {
// Default handler
}
})Thanks in advance
:point_up: Edit: Oh and a separate but equally important question:
These dynamically loaded modules should re-use dependencies that are declared/loaded by our app (an Angular CLI app with webpack). In the past we have done this:
import * as rxjs from "rxjs";
SystemJS.set("rxjs", SystemJS.newModule(rxjs));Is there perhaps a way to hook into the System dependency resolution such that:
System.someModuleRequires(moduleName => {
if (moduleName === "rxjs") {
return import("rxjs"); // Import webpack bundle
} else {
// Default handler
}
})Note: I guess this one would be System.set, but with a promise that resolves to a module (or a function that returns a promise):
System.set("rxjs", () => import("rxjs"))Thanks in advance
Hello... Sorry if I'm missing this somewhere, but is there an example, article, etc anywhere that goes into using Cypress and SystemJS together? I have a utility MFE that I need to import but when trying to run Cypress tests it obviously can't resolve the import (e.g. import doSomething from '@projectname/myutilmfe').
I've tried adding @cypress/webpack-preprocessor passing in the webpack config to webpackOptions, but I obviously don't have the import-maps and such. Any pointers or links would be super helpful.