Modules work only via HTTP s not locally Modules only work inside modules e g show js export const sqrt Math sqrt export function square x return x x export function diag x y return sqrt square x square y import square from url show js console log square 11 121 Scripts vs Modules JS or MJS they re NOT completely the same Detail Scripts Modules HTML element script script type module Default mode non strict strict Top level variables are global local to module Value of this at top level window undefined Executed synchronously asynchronously Declarative imports import statement no yes Programmatic imports Promise based API yes yes File extension js js or mjs You can t use raw githubusercontent com to refer to modules in JavaScript it ll complain about th e type format since the imported scripts must be text javascsript can t be text plain very strict Workaround using cdn jsdelivr net just need to tweak the URL http raw githubusercontent com username repo branch path to file js to http cdn jsdelivr net gh username repo path to file js Steps Find your link on GitHub and click to the Raw version Copy the URL Change raw githubusercontent com to cdn jsdelivr net Insert gh before your username Remove the branch name Optional Insert the version you want to link to as version if you do not do this you will get the latest which may cause long term caching Look at an example Can t use this url https raw githubusercontent com mayeedwin es6 modules master modules Add js Or you ll get the error Failed to load module script Expected a JavaScript module script but the server responded with a MIME type of text plain Strict MIME type checking is enforced for module scripts per HTML spec To fix this modify the URL string to use cdn jsdeliver net as described above https cdn jsdelivr net gh mayeedwin es6 modules modules Add js here is a working live demo import Add from https cdn jsdelivr net gh mayeedwin es6 modules modules Add js let a Add 2 5 console log Add a import https cdn jsdelivr net gh mayeedwin es6 modules modules Add js then module Do something with the module console log JSON stringify module for let key in module console log key
repo branch path to file js to http cdn jsdelivr net gh username repo path to file js Steps Find your link on GitHub and click to the Raw version Copy the URL Change raw githubusercontent com to cdn jsdelivr net Insert gh before your username Remove the branch name Optional Insert the version you want to link to as version if you do not do this you will get the latest which may cause long term caching Look at an example Can t use this url https raw githubusercontent com mayeedwin es6 modules master modules Add js Or you ll get the error Failed to load module script Expected a JavaScript module script but the server responded with a MIME type of text plain Strict MIME type checking is enforced for module scripts per HTML spec To fix this modify the URL string to use cdn jsdeliver net as described above https cdn jsdelivr net gh mayeedwin es6 modules modules Add js here is a working live demo import Add from https cdn jsdelivr net gh mayeedwin es6 modules modules Add js let a Add 2 5 console log Add a import https cdn jsdelivr net gh mayeedwin es6 modules modules Add js then module Do something with the module console log JSON stringify module for let key in module console log key