Module format error on import with vitest

[jonatansberg]

Hey!
I get the following error when running a component test that imports clsx in vitest:

(node:57821) Warning: To load an ES module, set "type": "module" in the package.json or use the .mjs extension.
(Use `node --trace-warnings ...` to show where the warning was created)
 ❯ src/Route.test.ts (0)

⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯ Failed Suites 1 ⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯

 FAIL  src/Route.test.ts [ src/Route.test.ts ]
SyntaxError: Unexpected token 'export'
 ❯ Object.compileFunction node:vm:360:18

Module /node_modules/clsx/dist/clsx.m.js:1 seems to be an ES Module but shipped in a CommonJS package. You might want to create an issue to the package "clsx" asking them to ship the file in .mjs extension or add "type": "module" in their package.json.

As a temporary workaround you can try to inline the package by updating your config:

// vitest.config.js
export default {
  test: {
    deps: {
      inline: [
        "clsx"
      ]
    }
  }
}

Seems like renaming clsx.m.js to clsx.mjs in the dist folder does the trick.

[khill-fbmc]

I knew it wasn't just me! Can we get a merge of this please?

[wojtekmaj]

Would have been fixed by #57

[lukeed]

Closed by #57