CODEWITHSUNDEEP
javascriptsafariecmascript-6es6-module-loaderes6-modules
Zorgatone
Zorgatone

Reputation: 4293

Importing ES2015 module in Safari DP requires file extension

I'm currently testing ES2015 coverage on Safari Developer Preview (which claims to support 100% ES2015, modules included).

I've made a simple test, using the same syntax I've been using regularly when developing using ES2015 code (along with Babel.JS for transpiling and Browserify for bundling).

Unexpectedly my code wouldn't work without including the .js extension in the import statement. Is that standard behavior? I thought you could omit that.

/* filename: scripts/alert.js */
export default class Alert {
    constructor(message) {
        this.message = message;
    }
    
    show() {
        alert(this.message);
    }
}

// Another file


/* filename: scripts/index.js */
import Alert from "./alert.js"; // this won't work if I change it to 'import Alert from "./alert";'

(new Alert("Hello, World!")).show();
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8" />
    <title>ES2015 Modules</title>
</head>
<body>
    <h1>ES2015 Modules</h1>
    <script async="async" type="module" src"scripts/index.js">
    </script>
</body>
</html>

Upvotes: 1

Views: 883

Answers (1)

T.J. Crowder
T.J. Crowder

Reputation: 1075059

Unexpectedly my code wouldn't work without including the .js extension in the import statement. Is that standard behavior? I thought you could omit that.

It's not the browser's job to second-guess what that resource specifier means to the server. You can certainly configure your server to respond to the GET without the .js by delivering a matching file that has .js, but that's server configuration.

There's likely to be evolution in this regard. For instance, right now the spec requires that a module resource specifier start with either / or ./. This is specifically so that...

...in the future we can allow custom module loaders to give special meaning to "bare" import specifiers, like import "jquery" or import "web/crypto". For now any such imports will fail, instead of being treated as relative URLs.

Upvotes: 2

Related Questions