CODEWITHSUNDEEP
javascripthtmlecmascript-6
s.n
s.n

Reputation: 703

JavaScript function Import not working

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());

Upvotes: 11

Views: 48415

Answers (1)

NotBad4U
NotBad4U

Reputation: 1542

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

Upvotes: 20

Related Questions