windicss / windicss-webpack-plugin

🍃 Windi CSS for webpack ⚡
https://windicss.org/integrations/webpack.html
79 stars 19 forks source link

Node.js crashed when using windicss and mdx-bundler in Next.js dev mode. #93

Closed tmkx closed 2 years ago

tmkx commented 3 years ago

Describe the bug Node.js crashed when using windicss and mdx-bundler in Next.js dev mode.

To Reproduce Steps to reproduce the behavior:

  1. Clone repository https://github.com/tmkx/next-windi
  2. Run pnpm dev
  3. Open http://localhost:3000/posts/hello-world
  4. See error

Behavior mdx-bundler + dev/build = ✅ windi + dev/build = ✅ windi + mdx-bundler + build = ✅ windi + mdx-bundler + dev = ❌ image

Additional context postcss-windicss has the same problem. Tested in Node v14.17.3.

tmkx commented 3 years ago

I have figured out that it's caused by:

  1. windicss-webpack-plugin https://github.com/windicss/windicss-webpack-plugin/blob/d2252189e5c189710a0a4b9dd9eaef6a64b54888/src/plugin.ts#L236

  2. @windicss/plugin-utils https://github.com/windicss/vite-plugin-windicss/blob/71308dbedbf40268ee2d1dd517d0dabcf8652809/packages/config/src/index.ts#L71

  3. jiti https://github.com/unjs/jiti/blob/a7e3eaca580daf54ced23bd3097e2ea2d61ef914/lib/index.js#L13

Remove require('../dist/v8cache') and it works.

harlan-zw commented 3 years ago

Hey @tmkx

Thanks for the detailed issue and the debugging! I've taken a look and have been able to replicate the issue and come to the same conclusion on the issue.

It seems that jiti is having a conflict with the mdx-bundler package, maybe something with esbuild.

Jiti is used in the config resolving package, so I've made an issue there for making jiti optional (https://github.com/windicss/vite-plugin-windicss/issues/233) which seems like it would solve the issue. Although you may need to either inline your config or make it plain js.

tmkx commented 3 years ago

The root cause is that jiti uses v8-compile-cache, require will be rewritten and make importing esm in cjs context an error.

relevant code: https://github.com/kentcdodds/mdx-bundler/blob/f6bebc9e4763a91d5ec042ed669c5c726f455d7a/src/index.js#L41-L47

jiti issue and minimum code to replicate: https://github.com/unjs/jiti/issues/38

We can set the environment variable DISABLE_V8_COMPILE_CACHE=1 to disable the cache, but it's not a normal way to have to let all users do that.

harlan-zw commented 3 years ago

Ah nice one, looks like you're more across this issue than me. Thanks for making the jiti issue.

Do you think this issue would still be helpful https://github.com/windicss/vite-plugin-windicss/issues/233?

Or would a jiti issue fix resolve it

tmkx commented 3 years ago

maybe exposing an option to disable v8cache in jiti is more suitable 🤔

I've made a pr to fix that: https://github.com/unjs/jiti/pull/39