Trying ES6 imports with Chrome but it doesn't seem to work
Asked Answered
R

2

14

I am contemplating moving from Dart to ES6 but Chrome doesn't seem to support the new import statement which is critical to me.

I used the (named export) code from this site: http://www.2ality.com/2014/09/es6-modules-final.html

I tried it even with

<module import="main"><module>

I get the error: "Unexpected token import"

Any information if they will support it before the final release ?

code:

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8" />
    <title>ES6</title>
</head>
<body bgcolor="blue">
  <script type="module" src="main.js"></script>
</body>
</html>

main.js

import { square, diag } from 'lib';
console.log(square(11)); // 121
console.log(diag(4, 3)); // 5

lib.js:

export const sqrt = Math.sqrt;
export function square(x) {
    return x * x;
}
export function diag(x, y) {
    return sqrt(square(x) + square(y));
}
Redolent answered 19/2, 2016 at 2:53 Comment(8)
iirc google chrome does not support modules yet.Eyas
Yeah, I noticed that... That's why my question is: Any information if they will support it before the final release ?Redolent
See this.Eyas
There is no "final release" of Chrome. There is just the next release, and then the one after that. Anyway, don't worry about native support in Chrome, just transpile your code like everyone else does.Alliterate
Possible duplicate of ECMA 6 Not working although experimental js is enabledPenitential
A question like this isn't a good fit for Stack Overflow. Imagine we would get questions like this for every version of Chrome. What good is this information after the version was released? Look at the appropriate development channels.Penitential
Chrome is a compiler just like Java. Different versions support different features. I don't see the difference.Redolent
@FelixKling SO should implement version tags...Buehler
R
13

It works now, finally in Chrome 60 with the Experimental Web Platform features enabled.

Here is a test:
https://github.com/paulirish/es-modules-todomvc

See here for status news:
https://www.chromestatus.com/features/5365692190687232

Redolent answered 21/2, 2016 at 15:55 Comment(2)
How do you go about setting "Experiment Web Platform" features as enabled?Peppergrass
In the Chrome browser, type in the web address chrome://flags/. This action results in a list of experimental browser features available to you.Redolent
S
6

Safari Tech Review 19, via WebKit, now supports modules.

https://twitter.com/Constellation/status/806660783312543744

https://webkit.org/status/

Slink answered 8/12, 2016 at 18:28 Comment(0)

© 2022 - 2024 — McMap. All rights reserved.