Skip to content

Commit 16818a2

Browse files
authored
add import assertions to system-register.md (systemjs#2436)
1 parent 1b03996 commit 16818a2

File tree

1 file changed

+53
-2
lines changed

1 file changed

+53
-2
lines changed

docs/system-register.md

Lines changed: 53 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -11,6 +11,7 @@ This format provides support for:
1111
* Top-level await
1212
* Live bindings updates, including through reexports, star exports and namespace imports, and any combination of these
1313
* Circular references including function hoisting (where functions in non-executed modules can be used in circular reference cases)
14+
* import assertions
1415

1516
By ensuring we cover all of these semantics, the guarantee is that if code works in browsers in ES modules, the associated
1617
System.register code can work with s.js providing a legacy fallback workflow that doesn't randomly break at semantic edge cases.
@@ -34,7 +35,9 @@ System.register(['dependency'], function (_export, _context) {
3435
});
3536
}
3637
};
37-
});
38+
},/*optional metas*/ [
39+
/*optional meta for dependency*/ {assert: {type: 'javascript'}},
40+
]);
3841
```
3942

4043
A global callback is used to fully support CSP policies in browsers.
@@ -94,7 +97,7 @@ System.register([...deps...], function (_export, _context) {
9497

9598
}
9699
};
97-
});
100+
}, [...metas...],);
98101
```
99102
100103
where:
@@ -107,6 +110,8 @@ where:
107110
* `_export: ({ [name: String]: any }) => value` - The bulk form of the export function allows setting an object of exports. This is not just sugar, but improves performance by calling fewer setter functions when used, so should be used whenever possible by implementations over the direct export form.
108111
* `_context.meta: Object` - This is an object representing the value of `import.meta` for a module execution. By default it will have `import.meta.url` present in SystemJS.
109112
* `_context.import: (id: String) => Promise<Module>` This is the contextual dynamic import function available to the module as the replacement for `import()`.
113+
* `metas: Object[]` - The metadata attached to the module dependency, indexed in the same order as `deps`. This is an optional argument.
114+
* for import assert the metadata is `{assert: {type: 'javascript'}}`
110115
111116
> Note as of SystemJS 2.0 support for named `System.register(name, deps, declare)` is no longer supported, as instead code optimization approaches that combine modules
112117
like with [Rollup's code-splitting workflows](https://rollupjs.org/guide/en#experimental-code-splitting) are recommended instead.
@@ -241,3 +246,49 @@ Could be written:
241246
```
242247

243248
Although in the case of not having any dependencies, it could be equally valid to omit hoisting entirely.
249+
250+
#### Import assertions
251+
252+
```js
253+
import a from './a.json' assert { type: 'json' };
254+
import b from 'b'
255+
import c from './c.css' assert { type: 'css' };
256+
257+
const { d } = await import('d')
258+
const { e } = await import('e',{assert: {type: 'javascript'}})
259+
```
260+
261+
->
262+
263+
```js
264+
System.register(['./a.json', 'b', './a.css'], function ($__export, $__moduleContext) {
265+
var a, b, c
266+
267+
return {
268+
setters: [
269+
function (m) {
270+
a = m["default"];
271+
},
272+
function (m) {
273+
b = m["default"];
274+
},
275+
function (m) {
276+
c = m["default"];
277+
}
278+
],
279+
execute: async function () {
280+
const {d} = await $__moduleContext.import('d')
281+
const {e} = await $__moduleContext.import('e', {assert: {type: 'javascript'}})
282+
}
283+
};
284+
}, [
285+
{assert: {type: 'json'}},
286+
/*just omit or use undefined if not needed*/ undefined,
287+
{assert: {type: 'css'}},
288+
]);
289+
```
290+
291+
Import assertion used to ensure the module is loaded with the correct type. The import assertion is passed to the loader's `import` method. The loader can use the import assertion to determine the correct module format to load. The import assertion is also passed to the module's `resolve` hook.
292+
293+
> **Note**
294+
> More about import assertions https://github.com/tc39/proposal-import-assertions

0 commit comments

Comments
 (0)