27

I'd like to export a module using the ES6 syntax only if it is supported in the current runtime. The goal is to develop a library that support different module management systems.

As export is a keyword, something like will throw a syntax error :

typeof export
11
  • 1
    no even in ES5 export and import are reserved keywords and it raises a syntax error that can't be catched Jan 13, 2015 at 12:49
  • I think you should use ES6 syntax; and distribute a version that is compiled by 6-to-5.
    – Bergi
    Jan 13, 2015 at 13:00
  • possible duplicate of How can I feature-detect ES6 generators?
    – JJJ
    Jan 13, 2015 at 13:00
  • 5
    Not a duplicate because of different syntax rules (generator could be tested via eval, modules can't, afaics)
    – kangax
    Jan 13, 2015 at 17:19
  • 2
    @joews because eval parses its string as Script and not Module (in other words, ExportDeclaration's and ImportDeclaration's can not be eval'd)
    – kangax
    Jan 25, 2015 at 18:36

3 Answers 3

14

Use


'noModule' in HTMLScriptElement.prototype

ref

0
5

2021 Update:

While the Loader spec seems to have stalled the dynamic import alternative has been implemented by various runtimes.

Since support for modules is a prerequisite for dynamic imports the latter can be used to probe support for the former.

This doesn't rely on any DOM API specifics so it can be used in other contexts. One limitation is that it must be queried asynchronously. Another limitation is that this detection isn't compatible with unsafe-eval CSPs, in that case probing via HTMLScriptElement or the Worker API can be used as fallback.

let supported = null;
async function modulesSupported() {
   if (supported !== null) {
      return supported;
   }

   try {
     let module = await new Function("return (async () => {return await import('data:application/javascript,export%20let%20canary%20=%201;')})")()()
     supported = module && module.canary && module.canary == 1;
   } catch(e) {
     supported = false;
   }

   return supported;
}

modulesSupported().then(r => console.log(r));
// => `true`

Old answer:

Revision 27 of the spec had a Reflect.Loader API that could be used for module reflection.

While that isn't direct feature detection for the export keyword in itself, it might have been possible to load a module that uses export keywords from a data-uri and then check whether it throws parse errors or not.

But it has been removed with revision 28, with the following changelog entry:

Removed loader pipeline and Reflect.Loader API (functionality being transferred to separate specification)


Thus, as far as i can tell, the spec does not seem to provide any way of feature detection at the time of writing.

In the future it might be possible with Reflect.Loader or its replacements.

Edit: The loader spec seems to be developed managed by the whatwg, but it's not yet in a state from which we could derive feature detection.

3
  • Has that future arrived yet?
    – vsync
    Mar 31, 2016 at 11:26
  • 1
    If the proposal github.com/domenic/proposal-import-function becomes a reality (in stage 2 right now) we will easily check for typeof import === 'function' Oct 5, 2016 at 7:20
  • @krampstudio The code sugguested by your comment produces an "Uncaught SyntaxError" in Chrome. Please see my answer for a working check.
    – user5739133
    Mar 28, 2019 at 15:23
2

Check for the 'noModule' attribute:

document.currentScript && "noModule" in document.currentScript;
2
  • 1
    This doesn't work since OP in general wants to check different runtimes. DOM APIs are not necessarily available, e.g. in node.js or web workers. If they were available a check would be trivial by building a <script type='module'> element.
    – the8472
    Mar 28, 2019 at 19:49
  • @the8472 Web workers are loaded by DOM APIs, so you should know by that point whether es6 modules are supported or not. With node.js, you can just require a minimum version of node.js.
    – Sora2455
    Mar 28, 2019 at 23:25

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.