mjs files not importing in dev mode?

[endquote]

I have some .mjs files that are imported in my next project and required in various utility scripts. This has worked fine for some time.

// use utils/constants.mjs in Layout.jsx
import { BASE_HREF, DEV } from "../utils/constants";

But recently, they do not seem to be included in the dev version of the application. npm run dev runs the app, but in the console I get things like:

Error was not caught ReferenceError: module is not defined
    at eval (webpack-internal:///./utils/constants.mjs:35)
    at Module../utils/constants.mjs (_app.js:2765)
    at __webpack_require__ (webpack.js?ts=1589750690485:863)
    at fn (webpack.js?ts=1589750690485:151)
    at Module.eval (webpack-internal:///./components/Layout.jsx:10)
    at eval (webpack-internal:///./components/Layout.jsx:269)
    at Module../components/Layout.jsx (_app.js:46)
    at __webpack_require__ (webpack.js?ts=1589750690485:863)
    at fn (webpack.js?ts=1589750690485:151)
    at Module.eval (webpack-internal:///./pages/_app.jsx:8)
    at eval (webpack-internal:///./pages/_app.jsx:94)
    at Module../pages/_app.jsx (_app.js:2742)

What's extra weird is that if I run the production version with npm run start, everything works fine.

I can repro on node 12 and 14 and on two different machines. next is at version 9.4.1.

I see #9607, but that seems like a different issue?

I also see experiments.mjs in Webpack 5... but we're not on 5 yet right?

[multipolygon]

I also have this issue.

[multipolygon]

Seems like simply renaming the .mjs files to .js worked for me.

[endquote]

Renaming to .js was no good for me, because I had other scripts loading those files as modules.

This problem just motivated me to port the whole site to TypeScript.

[jaydenseric]

This is a straight-up Next.js bug:

#17806