Supporting Preact with Next.js v12

[neeraj3029]

With the recent release of next v12, using preact with Next.js seems a bit difficult. I am looking for some workarounds to accomplish this. Read more here: https://github.com/vercel/next.js/issues/31240

[kidonng]

Interestingly, just installing scheduler is enough to upgrade one project to Next.js 12 (https://github.com/denoland/doc_website/pull/256) but not on a similar project (https://github.com/denoland/dotland/pull/1942):

$ next build
warn  - You have enabled experimental feature(s).
warn  - Experimental features are not covered by semver, and may cause unexpected or broken application behavior. Use them at your own risk.

info  - Checking validity of types  
warn  - The Next.js plugin was not detected in your ESLint configuration. See https://nextjs.org/docs/basic-features/eslint#migrating-existing-config
info  - Creating an optimized production build  
info  - Compiled successfully

> Build error occurred
file:///workspaces/dotland/node_modules/react-dom/server.mjs:2
export { default } from 'preact/compat/server';
         ^^^^^^^
SyntaxError: The requested module 'preact/compat/server' does not provide an export named 'default'
    at ModuleJob._instantiate (internal/modules/esm/module_job.js:121:21)
    at async ModuleJob.run (internal/modules/esm/module_job.js:166:5)
    at async Loader.import (internal/modules/esm/loader.js:178:24) {
  type: 'SyntaxError'
}

EDIT: yup, I find out it's because there are several imports from react-dom in the code.

[kittipongint]

Like @kidonng said, Just install scheduler is enough to let next.js 12.0.4 work with preact.js for me.

[neeraj3029]

Yes, that's indeed a potential workaround. But, I think it was wondering if we could solve this problem with this plugin :)

[neeraj3029]

Fixed with: https://github.com/vercel/next.js/pull/31264