diff --git a/package.json b/package.json index a721db0a1fced..3995244244adf 100644 --- a/package.json +++ b/package.json @@ -110,7 +110,7 @@ "@opentelemetry/api": "1.4.1", "@picocss/pico": "1.5.10", "@rspack/core": "1.3.2", - "@rspack/plugin-react-refresh": "1.1.0", + "@rspack/plugin-react-refresh": "1.2.0", "@svgr/webpack": "5.5.0", "@swc/cli": "0.1.55", "@swc/core": "1.9.3", diff --git a/packages/next-rspack/package.json b/packages/next-rspack/package.json index 3a15e2faa3c6e..02b909c01f530 100644 --- a/packages/next-rspack/package.json +++ b/packages/next-rspack/package.json @@ -8,7 +8,7 @@ "types": "index.d.ts", "dependencies": { "@rspack/core": "1.3.2", - "@rspack/plugin-react-refresh": "1.1.0", + "@rspack/plugin-react-refresh": "1.2.0", "react-refresh": "0.12.0" } } diff --git a/packages/next/src/build/webpack-config.ts b/packages/next/src/build/webpack-config.ts index f2ba4945ad317..025e7afded23a 100644 --- a/packages/next/src/build/webpack-config.ts +++ b/packages/next/src/build/webpack-config.ts @@ -671,15 +671,19 @@ export default async function getBaseWebpackConfig( '...', ] + const reactRefreshEntry = isRspack + ? getRspackReactRefresh().entry + : require.resolve( + `next/dist/compiled/@next/react-refresh-utils/dist/runtime` + ) + const clientEntries = isClient ? ({ // Backwards compatibility 'main.js': [], ...(dev ? { - [CLIENT_STATIC_FILES_RUNTIME_REACT_REFRESH]: require.resolve( - `next/dist/compiled/@next/react-refresh-utils/dist/runtime` - ), + [CLIENT_STATIC_FILES_RUNTIME_REACT_REFRESH]: reactRefreshEntry, [CLIENT_STATIC_FILES_RUNTIME_AMP]: `./` + path @@ -705,9 +709,7 @@ export default async function getBaseWebpackConfig( ? { [CLIENT_STATIC_FILES_RUNTIME_MAIN_APP]: dev ? [ - require.resolve( - `next/dist/compiled/@next/react-refresh-utils/dist/runtime` - ), + reactRefreshEntry, `./` + path .relative( @@ -1902,7 +1904,11 @@ export default async function getBaseWebpackConfig( isClient && (isRspack ? // eslint-disable-next-line - new (getRspackReactRefresh() as any)({ injectLoader: false }) + new (getRspackReactRefresh() as any)({ + injectLoader: false, + injectEntry: false, + overlay: false, + }) : new ReactRefreshWebpackPlugin(webpack)), // Makes sure `Buffer` and `process` are polyfilled in client and flight bundles (same behavior as webpack 4) (isClient || isEdgeServer) && diff --git a/packages/next/src/build/webpack/config/blocks/base.ts b/packages/next/src/build/webpack/config/blocks/base.ts index 9e8d19981ce62..8a7dc4110814e 100644 --- a/packages/next/src/build/webpack/config/blocks/base.ts +++ b/packages/next/src/build/webpack/config/blocks/base.ts @@ -34,8 +34,6 @@ export const base = curry(function base( if (ctx.isDevelopment) { if (process.env.__NEXT_TEST_MODE && !process.env.__NEXT_TEST_WITH_DEVTOOL) { config.devtool = false - } else if (process.env.NEXT_RSPACK) { - config.devtool = 'source-map' } else { // `eval-source-map` provides full-fidelity source maps for the // original source, including columns and original variable names. @@ -51,14 +49,6 @@ export const base = curry(function base( (ctx.productionBrowserSourceMaps && ctx.isClient) ) { config.devtool = 'source-map' - config.plugins ??= [] - config.plugins.push( - new DevToolsIgnorePlugin({ - // TODO: eval-source-map has different module paths than source-map. - // We're currently not actually ignore listing anything. - shouldIgnorePath, - }) - ) } else { config.devtool = false } @@ -69,7 +59,7 @@ export const base = curry(function base( } config.plugins ??= [] - if (config.devtool === 'source-map') { + if (config.devtool === 'source-map' && !process.env.NEXT_RSPACK) { config.plugins.push( new DevToolsIgnorePlugin({ shouldIgnorePath, diff --git a/packages/next/src/shared/lib/get-rspack.ts b/packages/next/src/shared/lib/get-rspack.ts index 76857220b5c01..e692d0144db78 100644 --- a/packages/next/src/shared/lib/get-rspack.ts +++ b/packages/next/src/shared/lib/get-rspack.ts @@ -20,7 +20,12 @@ export function getRspackReactRefresh() { gateCanary() try { // eslint-disable-next-line import/no-extraneous-dependencies - return require('@rspack/plugin-react-refresh') + const plugin = require('@rspack/plugin-react-refresh') + const entry = require.resolve( + '@rspack/plugin-react-refresh/react-refresh-entry' + ) + plugin.entry = entry + return plugin } catch (e) { if (e instanceof Error && 'code' in e && e.code === 'MODULE_NOT_FOUND') { throw new Error( diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 479b0875b3fbe..52e762ef336e9 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -124,8 +124,8 @@ importers: specifier: 1.3.2 version: 1.3.2(@swc/helpers@0.5.15) '@rspack/plugin-react-refresh': - specifier: 1.1.0 - version: 1.1.0(react-refresh@0.12.0)(webpack-hot-middleware@2.26.1) + specifier: 1.2.0 + version: 1.2.0(react-refresh@0.12.0)(webpack-hot-middleware@2.26.1) '@svgr/webpack': specifier: 5.5.0 version: 5.5.0 @@ -1678,8 +1678,8 @@ importers: specifier: 1.3.2 version: 1.3.2(@swc/helpers@0.5.15) '@rspack/plugin-react-refresh': - specifier: 1.1.0 - version: 1.1.0(react-refresh@0.12.0)(webpack-hot-middleware@2.26.1) + specifier: 1.2.0 + version: 1.2.0(react-refresh@0.12.0)(webpack-hot-middleware@2.26.1) react-refresh: specifier: 0.12.0 version: 0.12.0 @@ -5319,8 +5319,8 @@ packages: resolution: {integrity: sha512-VynGOEsVw2s8TAlLf/uESfrgfrq2+rcXB1muPJYBWbsm1Oa6r5qVQhjA5ggM6z/coYPrsVMgovl3Ff7Q7OCp1w==} engines: {node: '>=16.0.0'} - '@rspack/plugin-react-refresh@1.1.0': - resolution: {integrity: sha512-Aaqoa8VnpGjBMUrjE4+SeHaEKYZ/bvaPV20MBk/SLvivug4oRzIGbUn7QFROBSdxx0Sw0yPjK5cSZLTxySatCQ==} + '@rspack/plugin-react-refresh@1.2.0': + resolution: {integrity: sha512-DTsbtggCfsiXE5QQtYMS8rKfEF8GIjwPDbgIT6Kg8BlAjpJY4jT5IisyhfIi7YOT3d5RIvu60iFB6Kr9sSMsnA==} peerDependencies: react-refresh: '>=0.10.0 <1.0.0' webpack-hot-middleware: 2.x @@ -21671,7 +21671,7 @@ snapshots: '@rspack/lite-tapable@1.0.1': {} - '@rspack/plugin-react-refresh@1.1.0(react-refresh@0.12.0)(webpack-hot-middleware@2.26.1)': + '@rspack/plugin-react-refresh@1.2.0(react-refresh@0.12.0)(webpack-hot-middleware@2.26.1)': dependencies: error-stack-parser: 2.1.4 html-entities: 2.6.0