es-module-shims 2.0.9 → 2.1.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +31 -19
- package/dist/es-module-shims-typescript.js +3 -3
- package/dist/es-module-shims.debug.js +146 -130
- package/dist/es-module-shims.js +145 -129
- package/dist/es-module-shims.wasm.js +145 -129
- package/package.json +3 -3
package/README.md
CHANGED
|
@@ -11,7 +11,8 @@ The following modules features are polyfilled:
|
|
|
11
11
|
* [Import Maps](#import-maps) polyfill.
|
|
12
12
|
* [JSON](#json-modules) and [CSS modules](#css-modules) with import assertions when enabled.
|
|
13
13
|
* [Wasm modules](#wasm-modules) with support for Source Phase Imports when enabled.
|
|
14
|
-
* [
|
|
14
|
+
* [Import defer](#import-defer) via syntax stripping to allow usage in modern browsers with a polyfill fallback when enabled.
|
|
15
|
+
* [TypeScript](#typescript-type-stripping) type stripping when enabled.
|
|
15
16
|
|
|
16
17
|
When running in shim mode, module rewriting is applied for all users and custom [resolve](#resolve-hook) and [fetch](#fetch-hook) hooks can be implemented allowing for custom resolution and streaming in-browser transform workflows.
|
|
17
18
|
|
|
@@ -28,7 +29,7 @@ Because we are still using the native module loader the edge cases work out comp
|
|
|
28
29
|
Include ES Module Shims with a `async` attribute on the script, then include an import map and module scripts normally:
|
|
29
30
|
|
|
30
31
|
```html
|
|
31
|
-
<script async src="https://ga.jspm.io/npm:es-module-shims@2.0
|
|
32
|
+
<script async src="https://ga.jspm.io/npm:es-module-shims@2.1.0/dist/es-module-shims.js"></script>
|
|
32
33
|
|
|
33
34
|
<!-- https://generator.jspm.io/#U2NhYGBkDM0rySzJSU1hKEpNTC5xMLTQM9Az0C1K1jMAAKFS5w0gAA -->
|
|
34
35
|
<script type="importmap">
|
|
@@ -235,28 +236,29 @@ Works in all browsers with [baseline ES module support](https://caniuse.com/#fea
|
|
|
235
236
|
|
|
236
237
|
Browser Compatibility on baseline ES modules support **with** ES Module Shims:
|
|
237
238
|
|
|
238
|
-
| ES Modules Features
|
|
239
|
-
|
|
|
240
|
-
| [modulepreload](#modulepreload)
|
|
241
|
-
| [Import Maps](#import-maps)
|
|
242
|
-
| [Import Map Integrity](#import-map-integrity)
|
|
243
|
-
| [Multiple Import Maps](#multiple-import-maps)
|
|
244
|
-
| [JSON Modules](#json-modules)
|
|
245
|
-
| [CSS Modules](#css-modules)
|
|
246
|
-
| [Wasm Modules](#wasm-modules)
|
|
239
|
+
| ES Modules Features | Chrome (63+) | Firefox (67+) | Safari (11.1+) |
|
|
240
|
+
| ------------------------------------------------ | ------------------------------------ | ------------------------------------ | ------------------------------------ |
|
|
241
|
+
| [modulepreload](#modulepreload) | :heavy_check_mark: | :heavy_check_mark: | :heavy_check_mark: |
|
|
242
|
+
| [Import Maps](#import-maps) | :heavy_check_mark: | :heavy_check_mark: | :heavy_check_mark: |
|
|
243
|
+
| [Import Map Integrity](#import-map-integrity) | :heavy_check_mark: | :heavy_check_mark: | :heavy_check_mark: |
|
|
244
|
+
| [Multiple Import Maps](#multiple-import-maps) | :heavy_check_mark: | :heavy_check_mark: | :heavy_check_mark: |
|
|
245
|
+
| [JSON Modules](#json-modules) | :heavy_check_mark: | :heavy_check_mark: | :heavy_check_mark: |
|
|
246
|
+
| [CSS Modules](#css-modules) | :heavy_check_mark: | :heavy_check_mark: | :heavy_check_mark: |
|
|
247
|
+
| [Wasm Modules](#wasm-modules) | 89+ | 89+ | 15+ |
|
|
248
|
+
| [Import Defer](#import-defer) (syntax-stripping) | :heavy_check_mark: | :heavy_check_mark: | :heavy_check_mark: |
|
|
247
249
|
|
|
248
250
|
Browser compatibility **without** ES Module Shims:
|
|
249
251
|
|
|
250
252
|
| ES Modules Features | Chrome | Firefox | Safari |
|
|
251
253
|
| --------------------------------------------- | ------------------ | ------------------ | ------------------ |
|
|
252
254
|
| [modulepreload](#modulepreload) | 66+ | 115+ | 17.5+ |
|
|
253
|
-
| [import.meta.url](#importmetaurl) | ~76+ | ~67+ | ~12+ |
|
|
254
255
|
| [Import Maps](#import-maps) | 89+ | 108+ | 16.4+ |
|
|
255
256
|
| [Import Map Integrity](#import-map-integrity) | 127+ | :x: | :x: |
|
|
256
257
|
| [Multiple Import Maps](#multiple-import-maps) | Pending | :x: | :x: |
|
|
257
258
|
| [JSON Modules](#json-modules) | 123+ | :x: | 17.2+ |
|
|
258
259
|
| [CSS Modules](#css-modules) | 123+ | :x: | :x: |
|
|
259
|
-
| [Wasm Modules](#wasm-modules) |
|
|
260
|
+
| [Wasm Modules](#wasm-modules) | Pending | :x: | :x: |
|
|
261
|
+
| [Import Defer](#import-defer) | Pending | :x: | :x: |
|
|
260
262
|
| import.meta.resolve | 105+ | 106+ | 16.4+ |
|
|
261
263
|
| [Module Workers](#module-workers) | ~68+ | ~113+ | 15+ |
|
|
262
264
|
| Top-Level Await | 89+ | 89+ | 15+ |
|
|
@@ -521,9 +523,11 @@ In shim mode, Wasm modules are always supported. In polyfill mode, Wasm modules
|
|
|
521
523
|
|
|
522
524
|
WebAssembly module exports are made available as module exports and WebAssembly module imports will be resolved using the browser module loader.
|
|
523
525
|
|
|
524
|
-
|
|
526
|
+
By default Wasm support will look for both source phase syntax as well as instance Wasm imports, resulting in full analysis of the module graph when either is unsupported.
|
|
525
527
|
|
|
526
|
-
|
|
528
|
+
If only using Wasm modules in the source phase set `polyfillEnable: ['wasm-module-sources']` [init option](#polyfill-enable-option) to ensure full native passthrough without the extra code analysis when Chrome ships the source phase.
|
|
529
|
+
|
|
530
|
+
When enabling the source phase feature either way, `WebAssembly.Module` is also polyfilled to extend from `AbstractModuleSource` per the source phase proposal.
|
|
527
531
|
|
|
528
532
|
WebAssembly modules require native top-level await support to be polyfilled, see the [compatibility table](#browser-support) above.
|
|
529
533
|
|
|
@@ -544,6 +548,14 @@ const instance = await WebAssembly.instantiate(mod, { /* ...imports */ });
|
|
|
544
548
|
|
|
545
549
|
If using CSP, make sure to add `'unsafe-wasm-eval'` to `script-src` which is needed when the shim or polyfill engages, note this policy is much much safer than eval due to the Wasm secure sandbox. See https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Content-Security-Policy/script-src#unsafe_webassembly_execution.
|
|
546
550
|
|
|
551
|
+
### Import Defer
|
|
552
|
+
|
|
553
|
+
> Stability: Stage 3 Standard, Pending Shipping
|
|
554
|
+
|
|
555
|
+
Implements the [Import Defer TC39 Proposal](https://github.com/tc39/proposal-defer-import-eval), including support for `import defer * as mod from './mod.js'`.
|
|
556
|
+
|
|
557
|
+
The polyfill is simply just a defer syntax stripping, allowing environments that do support import defer to benefit from the performance benefits, while still supporting the syntax in older browsers.
|
|
558
|
+
|
|
547
559
|
### TypeScript Type Stripping
|
|
548
560
|
|
|
549
561
|
Node.js recently [added support for automatically executing TypeScript with type stripping](https://nodejs.org/api/typescript.html). We support the exact same approach in ES Module Shims.
|
|
@@ -553,7 +565,7 @@ Once enabled, the separate `es-module-shims-typescript.js` extension must be ava
|
|
|
553
565
|
Example:
|
|
554
566
|
|
|
555
567
|
```html
|
|
556
|
-
<script async src="https://ga.jspm.io/npm:es-module-shims@2.0
|
|
568
|
+
<script async src="https://ga.jspm.io/npm:es-module-shims@2.1.0/dist/es-module-shims.js"></script>
|
|
557
569
|
<script type="esms-options">
|
|
558
570
|
{
|
|
559
571
|
"polyfillEnable": "all"
|
|
@@ -572,13 +584,13 @@ By default, when there is no DOM present, ES Module Shims will switch into shim
|
|
|
572
584
|
|
|
573
585
|
```js
|
|
574
586
|
/**
|
|
575
|
-
*
|
|
587
|
+
*
|
|
576
588
|
* @param {string} aURL a string representing the URL of the module script the worker will execute.
|
|
577
589
|
* @returns {string} The string representing the URL of the script the worker will execute.
|
|
578
590
|
*/
|
|
579
591
|
function getWorkerScriptURL(aURL) {
|
|
580
592
|
// baseURL, esModuleShimsURL are considered to be known in advance
|
|
581
|
-
// esModuleShimsURL - must point to the non-CSP build of ES Module Shims,
|
|
593
|
+
// esModuleShimsURL - must point to the non-CSP build of ES Module Shims,
|
|
582
594
|
// namely the `es-module-shim.wasm.js` output: es-module-shims/dist/es-module-shims.wasm.js
|
|
583
595
|
|
|
584
596
|
return URL.createObjectURL(new Blob(
|
|
@@ -687,7 +699,7 @@ DOM `load` events are fired for all `"module-shim"` scripts both for success and
|
|
|
687
699
|
|
|
688
700
|
The `polyfillEnable` option allows enabling polyfill features which are newer and would otherwise result in unnecessary polyfilling in modern browsers that haven't yet updated.
|
|
689
701
|
|
|
690
|
-
This options supports `"css-modules"`, `"json-modules"`, `"wasm-modules"`, `"
|
|
702
|
+
This options supports `"css-modules"`, `"json-modules"`, `"wasm-modules"`, `"wasm-module-sources"` and `"wasm-module-instances"`.
|
|
691
703
|
|
|
692
704
|
```html
|
|
693
705
|
<script type="esms-options">
|