-
-
Notifications
You must be signed in to change notification settings - Fork 58
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Switch to ESM format in newly generated modules (#417)
- Loading branch information
1 parent
632c33e
commit d518ae4
Showing
9 changed files
with
62 additions
and
125 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,9 @@ | ||
--- | ||
"generator-single-spa": major | ||
"single-spa-welcome": major | ||
"create-single-spa": major | ||
--- | ||
|
||
Output to ESM format rather than SystemJS format. Upgrade webpack-config-single-spa. | ||
|
||
Newly generated root-configs, single-spa applications, and utility modules will now output to ESM format rather than SystemJS format. To revert to SystemJS format, add the `outputSystemJS: true` option to options passed to webpack-config-single-spa within the webpack.config.js |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
|
@@ -5,44 +5,27 @@ | |
<meta name="viewport" content="width=device-width, initial-scale=1.0"> | ||
<meta http-equiv="X-UA-Compatible" content="ie=edge"> | ||
<title>Root Config</title> | ||
<!-- | ||
Remove this if you only support browsers that support async/await. | ||
This is needed by babel to share largeish helper code for compiling async/await in older | ||
browsers. More information at https://github.com/single-spa/create-single-spa/issues/112 | ||
--> | ||
<script src="https://cdn.jsdelivr.net/npm/[email protected]/runtime.min.js"></script> | ||
<!-- | ||
This CSP allows any SSL-enabled host and for arbitrary eval(), but you should limit these directives further to increase your app's security. | ||
Learn more about CSP policies at https://content-security-policy.com/#directive | ||
--> | ||
<meta http-equiv="Content-Security-Policy" content="default-src 'self' https: localhost:*; script-src 'unsafe-inline' 'unsafe-eval' https: localhost:*; connect-src https: localhost:* ws://localhost:*; style-src 'unsafe-inline' https:; object-src 'none';"> | ||
<meta name="importmap-type" content="systemjs-importmap" /> | ||
<meta name="importmap-type" use-injector /> | ||
<!-- If you wish to turn off import-map-overrides for specific environments (prod), uncomment the line below --> | ||
<!-- More info at https://github.com/joeldenning/import-map-overrides/blob/master/docs/configuration.md#domain-list --> | ||
<!-- More info at https://github.com/single-spa/import-map-overrides/blob/main/docs/configuration.md#domain-list --> | ||
<!-- <meta name="import-map-overrides-domains" content="denylist:prod.example.com" /> --> | ||
|
||
<!-- Shared dependencies go into this import map. Your shared dependencies must be of one of the following formats: | ||
1. System.register (preferred when possible) - https://github.com/systemjs/systemjs/blob/master/docs/system-register.md | ||
2. UMD - https://github.com/umdjs/umd | ||
3. Global variable | ||
More information about shared dependencies can be found at https://single-spa.js.org/docs/recommended-setup#sharing-with-import-maps. | ||
--> | ||
<script type="systemjs-importmap"> | ||
<!-- Shared dependencies go into this import map --> | ||
<script type="injector-importmap"> | ||
{ | ||
"imports": { | ||
"single-spa": "https://cdn.jsdelivr.net/npm/single-spa@5.9.0/lib/system/single-spa.min.js" | ||
"single-spa": "https://cdn.jsdelivr.net/npm/single-spa@6.0.3/lib/es2015/esm/single-spa.min.js" | ||
} | ||
} | ||
</script> | ||
<link rel="preload" href="https://cdn.jsdelivr.net/npm/single-spa@5.9.0/lib/system/single-spa.min.js" as="script"> | ||
<link rel="preload" href="https://cdn.jsdelivr.net/npm/single-spa@6.0.3/lib/es2015/esm/single-spa.min.js" as="module"> | ||
|
||
<!-- Add your organization's prod import map URL to this script's src --> | ||
<!-- <script type="systemjs-importmap" src="/importmap.json"></script> --> | ||
<!-- <script type="injector-importmap" src="/importmap.json"></script> --> | ||
|
||
<% if (isLocal) { %> | ||
<script type="systemjs-importmap"> | ||
<script type="injector-importmap"> | ||
{ | ||
"imports": { | ||
"@<?- orgName ?>/root-config": "//localhost:9000/<?- orgName ?>-root-config.js" | ||
|
@@ -51,28 +34,18 @@ | |
</script> | ||
<% } %> | ||
|
||
<!-- | ||
If you need to support Angular applications, uncomment the script tag below to ensure only one instance of ZoneJS is loaded | ||
Learn more about why at https://single-spa.js.org/docs/ecosystem-angular/#zonejs | ||
--> | ||
<!-- <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/zone.min.js"></script> --> | ||
|
||
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/import-map-overrides.js"></script> | ||
<% if (isLocal) { %> | ||
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/system.js"></script> | ||
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/extras/amd.js"></script> | ||
<% } else { %> | ||
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/system.min.js"></script> | ||
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/extras/amd.min.js"></script> | ||
<% } %> | ||
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/import-map-overrides.js"></script> | ||
<script src="https://cdn.jsdelivr.net/npm/@single-spa/[email protected]/lib/import-map-injector.js"></script> | ||
</head> | ||
<body> | ||
<noscript> | ||
You need to enable JavaScript to run this app. | ||
</noscript> | ||
<main></main> | ||
<script> | ||
System.import('@<?- orgName ?>/root-config'); | ||
window.importMapInjector.initPromise.then(() => { | ||
import('@<?- orgName ?>/root-config'); | ||
}); | ||
</script> | ||
<import-map-overrides-full show-when-local-storage="devtools" dev-libs></import-map-overrides-full> | ||
</body> | ||
|
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
|
@@ -53,10 +53,16 @@ export default function Root(props) { | |
create-single-spa will need to add React and ReactDOM to the import | ||
map. | ||
</p> | ||
<pre> | ||
<code>{`"react": "https://cdn.jsdelivr.net/npm/[email protected]/umd/react.production.min.js", | ||
"react-dom": "https://cdn.jsdelivr.net/npm/[email protected]/umd/react-dom.production.min.js"`}</code> | ||
</pre> | ||
<p> | ||
You can use{" "} | ||
<a | ||
href="https://generator.jspm.io/#U2VhYGBkDM0rySzJSU1hKEpNTC5xMLTQM9YzBADlj3RUGwA" | ||
target="_blank" | ||
> | ||
JSPM Generator | ||
</a>{" "} | ||
to generate an import map with shared dependencies from NPM. | ||
</p> | ||
</li> | ||
</ul> | ||
<p> | ||
|
Oops, something went wrong.