Js html import/export

Question

I've got 3 files: index html :

<!DOCTYPE html>
  <html lang="en">
   <head>
     <meta charset="UTF-8">
   </head>
   <body>

    <script type="application/javascript" src="js/dtms.js"></script>
   </body>
  </html>

And 2 js files:

module:

 export const gg = ['123', '2343', '323'];

main js:

 import {gg} from "/path/main.js";

And I am getting error in chrome debugging console: Uncaught SyntaxError: Unexpected token {

How to fix?

<script type="module" src="path/to/file.js"></script> but take in mind that not all browser support modules yet, see caniuse.com/#search=module — Yurii
– Yurii, Commented Feb 12, 2018 at 19:38
some further infos to previous comment blog.whatwg.org/js-modules — john Smith
– john Smith, Commented Feb 12, 2018 at 19:43
@Yurii, so the only way is to use smth like require js to import and export modules? — I. Gursky
– I. Gursky, Commented Feb 12, 2018 at 20:05
@I.Gursky it depends on what you need. If you need to load each of your js modules asynchronously then yes AMD (require.js, system.js etc) could be used. But it doesn't mean you need to write your code in an old boring AMD way like define('module', [dep1, dep2], function() { /*code*/ }). You can use some tools that convert es6 code to es5+AMD style. For example, you could use webpack+babel pair. But don't know why you may need this. Even with http2 you probably need to bundle your modules into one/few files. — Yurii
– Yurii, Commented Feb 12, 2018 at 20:27

аlex · Accepted Answer · 2018-02-12 21:07:55Z

2

It works here: here https://plnkr.co/edit/3Fy4J3PyvSOBn1avMvg4?p=preview

// Supported:

import {foo} from 'https://jakearchibald.com/utils/bar.js';
import {foo} from '/utils/bar.js';
import {foo} from './bar.js';
import {foo} from '../bar.js';

// Not supported:

import {foo} from 'bar.js';
import {foo} from 'utils/bar.js';

edited Feb 12, 2018 at 21:07

answered Feb 12, 2018 at 21:01

аlex

5,7161 gold badge31 silver badges40 bronze badges

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

Collectives™ on Stack Overflow

Js html import/export

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related