JavaScript function Import not working

Question

I am trying to import a function from a separate .js file. When I declare the import command the page is not executing the code. But when I delete the import command and execute a simple alert('Hello'), that thing is popping up on the page.

PROJECT STRUCTURE
--Todo-app
----js
------two.js
------main.js
----index.html

Index.html

<!DOCTYPE html>
<html>
<head>
    <title></title>
</head>
<body>
    <script src="js/main.js"></script>
</body>
</html>

two.js

export function one() {
    return 1 + 1;
}

main.js

import { one } from 'two';
alert(one());

Can you see in the console any errors messages with the import statement? — NotBad4U
– NotBad4U, Commented Jan 15, 2017 at 14:11
ES6 modules aren't supported in browsers (with the exception of Edge). The code needs to be transpiled with Babel. — Estus Flask
– Estus Flask, Commented Jan 15, 2017 at 14:25

NotBad4U · Accepted Answer · 2017-01-15 14:25:58Z

20

The import and export statements is not implemented in any browsers natively at this time. You need to use a transpiler like Babel

But chrome and firefox can parse this statements Uncaught SyntaxError: Unexpected token import but not support the module loading.

See MDN for more détails Reference Statements import

answered Jan 15, 2017 at 14:25

NotBad4U

1,5621 gold badge17 silver badges23 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

Estus Flask Over a year ago

ES6 modules have got experimental support in Edge developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/…

Quentin Over a year ago

All modern browsers now support JavaScript modules via script tag

Quentin Over a year ago

"You need to use a transpiler like Babel" — Babel is not a bundler. It can translate one module syntax into another, but it won't combine modules into a single script. Since browsers do support import and don't support require, using Babel is unhelpful (unless used in combination with a bundler).

Andrew S Over a year ago

This response is now out of date.

Collectives™ on Stack Overflow

JavaScript function Import not working

1 Answer 1

4 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

4 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related