Build error with NextJs

[alex289]

• Check if updating to the latest Preact version resolves the issue

Using Next.js -> package.json:

"next": "12.1.2",
"preact": "^10.7.0",
"react": "18.0.0",
"react-dom": "18.0.0"

Describe the bug
I am using Preact to replace React with webpacks alias config. After upgrading to React 18 I get following error when I try to build:

./node_modules/next/dist/client/index.js
Module not found: Package path ./compat/client is not exported from package path\to\project\node_modules\preact (see exports field in path\to\project\node_modules\preact\package.json)

(I removed personal data from the path)

To Reproduce

Steps to reproduce the behavior:

1. Create a NextJs project: yarn create next-app --typescript
2. Add preact: yarn add preact
3. Change next.config.js to:

/** @type {import('next').NextConfig} */
const nextConfig = {
  reactStrictMode: true,
  swcMinify: true,
  webpack: (config, { dev, isServer }) => {
    if (!dev && !isServer) {
      // Replace React with Preact only in client production build
      Object.assign(config.resolve.alias, {
        'react/jsx-runtime.js': 'preact/compat/jsx-runtime',
        react: 'preact/compat',
        'react-dom/test-utils': 'preact/test-utils',
        'react-dom': 'preact/compat',
      });
    }

    return config;
  },
};

module.exports = nextConfig;

4. Run: yarn build

Expected behavior
Build should succeed without errors.

[developit]

What is the reason for having React 18 installed alongside Preact?

[alex289]

@developit I use React while developing and only replace it with Preact in production.

[badaczewski]

I'm having the same issue from within my GatsbyJS project after upgrading to React 18.

Module not found: Error: Package path ./compat/client is not exported from package D:\XXX\XXX\node_modules\preact (see exports field in D:\XXX\XXX\node_modules\preact\package.json)