Es6 Module Import Giving "Uncaught Syntaxerror: Unexpected Identifier"

ES6 module Import giving Uncaught SyntaxError: Unexpected identifier

As @Bergi mentioned in the comment, adding type="module" to the main.js import line in the HTML solved the issue. All is working now. I.e.

<script type="module" src="assets/js/main.js">

Thanks to all of you who responded and tried to help.

ES6 import gives Unexpected Identifier SyntaxError when running on terminal

For Node.js, run the script with the --experimental-modules flag. This will allow you to use ES modules in Node.js without the need to transpile the import/export statements.

node --experimental-modules ./path/to/your.js

The error is sort of misleading because without this flag, Node is trying to parse your script as a CommonJS module instead of an ES module, which does not understand import/export.

Cannot use import statement outside a module and Uncaught SyntaxError: Unexpected identifier when importing a class

You can only import at the top level - it can't be done inside a block. Change

window.onload = function () {
  import Test from "./extended"
  new Test()
}

to

import Test from "./extended"
window.onload = function () {
  new Test()
};

Though, I'd also suggest not creating classes for side-effects - if you just want the class to do something, but not to return something useful, use a plain function instead.

export default () => {
  const prop = "Hello";
  console.log(prop);
};

ES6 modules in the browser: Uncaught SyntaxError: Unexpected token import

Many modern browsers now support ES6 modules. As long as you import your scripts (including the entrypoint to your application) using <script type="module" src="..."> it will work.

Take a look at caniuse.com for more details:
https://caniuse.com/#feat=es6-module

Uncaught syntax error when using ES-6 import syntax in Chrome

That's how it should be and make sure to import jQuery as well unless you've removed for brevity because $(document).ready wont work

import { test } from "./queue.js";
$(document).ready(() => {
  console.log(test);
});

---

Related Topics