ES2015 module import and export syntax error

Question

On using import export in ES6, I\'m getting below error:

SyntaxError: export declarations may only appear at top level

I surfed to f

Answer 1

Update summer 2017:

See http://caniuse.com/#search=modules, new support, maybe need to change settings.

Now that things are less vague. To make a module work you have to tell the browser that it is a module (the other being script). The first way is implicit, an imported module is always a module. The second way is with type module

Make sure import and export are only at top level, not inside a block, not inside an if statement, not inside a loop, etc.

Also make sure to provide the full path (including .js), it should start with ./ or ../. Assumming the files are in the same folder it would be import { cube, cubeRoot } from './functions.js';

eval on a module string will not work.

Outdated answer below:

The ES2015 module import and export syntax is not supported by any browser at the time I write this answer (04/2016). The error message is miss leading because it implies that the syntax is supported, but it is not supported at all. See the first note here https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/import

The reason is because the specification for module loaders is still a work in progress. See https://whatwg.github.io/loader/#status

They are tools however to polyfill or to transpile this syntax automatically like babel .