Hugo server fails to load es6 module

support
1

Hello,

Im loading a js module

 <!--  _layouts/default/builder.aspx -->
    <script src="/assets/vendor/template-builder/js/index.js" type="module"></script>

this js file uses some imports

import {options } from "../data/options.js";
import { view} from "../data/view.js";

The site builds correctly, and works with other servers (tested with sharepoint and vscode Live Server (ritwickdey.liveserver)

For some reason, when hugo server is serving the site I get the following error in the browser:

Failed to load module script: The server responded with a non-JavaScript MIME type of "application/json". Strict MIME type checking is enforced for module scripts per HTML spec.

Any ideas?

2

resources under assets not automatically published. you need to do this:

{{ $js_file := resources.Get "vendor/template-builder/js/index.js" }}

<script src="{{ $js_file.RelPermalink }}" type="module"></script>
3

Thanks for the response!

They are under static folder. I don’t think that’s the issue, as the js file is loading fine, what is failing is the “import” statement inside that js. and its only failing with hugo server (as much as I could test with other servers works ok)

4

Hello,

I just shortened the topic title.

No need to post long error messages on topic titles, instead please try to make them concise and descriptive of the issue at hand.

Thanks for the understanding.

1 Like
5

I can force the error by overriding the MIME type for js files in the site configuration:

[mediaTypes]
  [mediaTypes."application/json"]
    suffixes = ["js"]

Are you doing anything like this?

1 Like
6

This topic was automatically closed 2 days after the last reply. New replies are no longer allowed.