Es 6 Module is loaded in Chrome but not run

Question

In Chrome Canary 64 bits Version 61.0.3134.0, I enabled the experimental flag "Experimental Web Platform flag" as detailed in this post https://medium.com/dev-channel/es6-modules-in-chrome-canary-m60-ba588dfb8ab7.

This should allow me to use ES6 modules in the browser with no build step. My setup is very simple: I have 2 files:

My index.html:

<!DOCTYPE html> <html lang="en"> <head></head> <body> <script type="module" src="app.js"></script> </body> </html>

and my app.js:

console.log('hello');

I can see in the network tab of Chrome Dev Tools that the app.js is loaded, but nothing happens in the console. No error message. However if I remove type="module" from the script tag, the message "hello" does shown up in the console.

Mister Fresh · Accepted Answer · 2017-06-19 20:11:15Z

I was loading files from the filesystem.

For the ES 2015 loading to work, files must be loaded from a webserver. A simple Node Express server did the trick.

Mike Nakis · Accepted Answer · 2017-09-05 20:05:56Z

This can happen if the web server does not report the correct MIME type for the javascript file.

What happens is this: the browser requests the file, and the server retrieves and returns the file, but the content type response header does not contain any of the valid MIME types for javascript files, so the browser refuses to process the file any further. This behavior is according to the ES6 specification, and I have observed Chrome actually behaving this way.

There exist many valid MIME types for javascript files, "application/javascript" is one of them, and the web server must be able to correctly identify the javascript file as such, and return that specific MIME type in the response. This can be a bit tricky if you decide to use the ".mjs" file extension for a javascript module instead of ".js".

Collectives™ on Stack Overflow

Es 6 Module is loaded in Chrome but not run

2 Answers 2

Comments

Comments

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Related