CommonJs not imported correctly on Windows

[leopsidom]

Describe the bug

Import CommonJs module results in undefined on windows. More specifically:

import { highlight, languages } from 'prismjs';

results in languages and highlight being undefined since it relies on the following exports:

if (typeof module !== 'undefined' && module.exports) {
    module.exports = Prism;
}

However module.exports is undefined when running the test on windows.

Reproduction

https://stackblitz.com/edit/node-vqbbph?file=test/example.test.ts.

Reproduce steps:

1. Download the project to a windows machine;
2. run npm install && npm run test

System Info

System:
    OS: Windows 10 10.0.19042
    CPU: (6) x64 Intel(R) Core(TM) i5-8500 CPU @ 3.00GHz
    Memory: 956.45 MB / 15.80 GB
  Binaries:
    Node: 15.6.0 - C:\Program Files\nodejs\node.EXE
    npm: 7.19.0 - C:\Program Files\nodejs\npm.CMD
  Browsers:
    Edge: Spartan (44.19041.1266.0), Chromium (96.0.1054.62)
    Internet Explorer: 11.0.19041.1202
  npmPackages:
    @vitejs/plugin-vue: ^2.0.1 => 2.0.1
    vite: ^2.7.10 => 2.7.10
    vitest: ^0.0.125 => 0.0.125

Used Package Manager

npm

Validations

• Follow our Code of Conduct
• Read the Contributing Guidelines.
• Read the docs.
• Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
• Check that this is a concrete bug. For Q&A open a GitHub Discussion or join our Discord Chat Server.
• The provided reproduction is a minimal reproducible example of the bug.

[sheremet-va]

The same thing as: #379

We have to wait for a fix: unjs/mlly#28

[sheremet-va]

For now you can add this to your test config:

deps: {
  external: [/prismjs/],
},

[leopsidom]

@sheremet-va Thanks. This works but it creates another issue:

TypeError: Unknown file extension ".css" for ".../prism.css"

I think it's because I have to directly import the css file in my component:

import "prismjs/themes/prism.css";

[sheremet-va]

try /\/prismjs\//

[sheremet-va]

try /\/prismjs\//

well it wont work either
I believe you can come up with regexp that suites you!

[sheremet-va]

Maybe something like this?

deps: {
  external: [/prismjs\/(?!theme)/],
},

[leopsidom]

Ahh, nice that worked. /prismjs\/prism.js/ worked too. I didn't know we need to specify the path in external instead of the import syntax used, and so was trying something along /prismjs"$/ which obviously didn't work.

[sheremet-va]

Ahh, nice that worked. /prismjs\/prism.js/ worked too. I didn't know we need to specify the path in external instead of the import syntax used, and so was trying something along /prismjs"$/ which obviously didn't work.

Yeah, maybe we need to document that 👀 Full paths to file are needed.

[sheremet-va]

Fixed in https://github.com/vitest-dev/vitest/releases/tag/v0.0.139