Does Chrome support ES6 modules in script?
Problem is that, as we saw above, Chrome only support ES6 modules in script that are referenced in script tag with type module. Thankfully the chrome extension manifest accepts an html page for background. So let’s use this: and then create the following html page called background.html:
How do I run ES6 in the browser?
You can run ES6 in the browser in the "Try it out" section of their website. It functions similarly to jsfiddle. displays the result 2. Babel "transpiles", that is translate ES6 into ES5 javascript that can be run by current browser technology.
Should you go wild with ES6 modules?
Go wild! You may not be able to use ES6 modules directly for your professional work right now, but that shouldn’t stop you from using them in your code and transpiling it for all browsers. ES6 modules are the future.
How to enable arrow functions in chrome ES6?
In Chrome, most of the ES6 features are hidden behind a flag called "Experimental JavaScript features". Visit chrome://flags/#enable-javascript-harmony, enable this flag, restart Chrome and you will get many new features. Arrow functions are not yet implemented in V8/Chrome, so this flag won't "unlock" arrow functions.
Can you add inline scripts to Chrome extensions?
In chrome extensions, inline scripts are not allowed. So the script that imports the module should be added like that:
Does adding module support to a script reinforce the use strict directive?
Finally (but this is not a limitation) if you are adding module support to an extension you already developed, remember that adding module support to a script, reinforces the use strict directive. So you may have to review your code if something doesn’t work.
Does Chrome support ES6?
As of version 61, Chrome added support for ES6 module. That means you don’t have to keep maintaining bundlers just to support this indispensable feature. And that also means that you can use this awesome feature in extensions as well.
Can you specify that a script needs to be loaded with module support?
The only limitation I have found so far is with the content scripts. This cannot be defined through HTML, so there is no way to specify that the script needs to be loaded with module support. In this case you can keep using a bundler, or list all the needed scripts in the manifest.json, like for example:
Is ES6 supported in Opera?
Another limitation is that ES6 modules are not (yet) supported in Opera. Currently (with version 49.0.2725.64) the following error is thrown if you are using modules in extensions:
Promise
The Promise object is used for asynchronous computations. A Promise represents a value which may be available now, or in the future, or never.
Classes
OOP-style and boilerplate-free class syntax, including inheritance, super (), static members, and getters and setters.
let (Block-Scoped Variables)
let declares a variable within the scope of a block. This differs from var, which uses function level scope.
const (Block-Scoped Constants)
Constants (also known as “immutable variables”) are variables which cannot be re-assigned new content. Note that if the value is an object, the object itself is still mutable.
Array Static & Prototype Methods
Note: Array.prototype.values is not implemented in Chrome and should not be used. If the code in question is Closure compiled, a compile-time error will be thrown.
for...of Loops
Convenient operator to iterate over all values in an iterable collection. This differs from for ...in, which iterates over all enumerable properties of an object.
Template Literals
Expression interpolation for Strings, with the ability to access raw template pieces.
Can you test module type scripts?
So you cannot test module type scripts by opening the html file directly in the browser. You need a server serving them with the required CORS headers.
Is ES6 supported in Edge?
Using ES6 modules in the browser. Yes, ES6 module support is finally catching up in browsers, and its almost there in all browsers. Surprisingly Edge got it up and running before Firefox! But even Firefox has it behind a feature flag (check about:config) and this will be there by default in the next major release.
Does NodeJS support ES6?
In NodeJS too, we were already able to use ES6 modules with a .mjs extension. .js extension were still defaulting to CommonJS. But from v10 (which is out now!) Node will be supporting it fully and it will not need a separate extension.
