Skip to content

Commit d473eb3

Browse files
authored
Alternate bundler: fix react refresh and adjust sourcemap (#77875)
- Fix failures in #77871 that introduced by rstackjs/rspack-plugin-react-refresh#22 (comment) 🤦 - Align the inject entry logic with webpack - Use eval-source-map for rspack (before use source-map due to a rspack bug #75981 (comment)) - Temporarily remove source-map ignoreList for rspack (will add it back once rspack has built-in support) <!-- Thanks for opening a PR! Your contribution is much appreciated. To make sure your PR is handled as smoothly as possible we request that you follow the checklist sections below. Choose the right checklist for the change(s) that you're making: ## For Contributors ### Improving Documentation - Run `pnpm prettier-fix` to fix formatting issues before opening the PR. - Read the Docs Contribution Guide to ensure your contribution follows the docs guidelines: https://nextjs.org/docs/community/contribution-guide ### Adding or Updating Examples - The "examples guidelines" are followed from our contributing doc https://github.com/vercel/next.js/blob/canary/contributing/examples/adding-examples.md - Make sure the linting passes by running `pnpm build && pnpm lint`. See https://github.com/vercel/next.js/blob/canary/contributing/repository/linting.md ### Fixing a bug - Related issues linked using `fixes #number` - Tests added. See: https://github.com/vercel/next.js/blob/canary/contributing/core/testing.md#writing-tests-for-nextjs - Errors have a helpful link attached, see https://github.com/vercel/next.js/blob/canary/contributing.md ### Adding a feature - Implements an existing feature request or RFC. Make sure the feature request has been accepted for implementation before opening a PR. (A discussion must be opened, see https://github.com/vercel/next.js/discussions/new?category=ideas) - Related issues/discussions are linked using `fixes #number` - e2e tests added (https://github.com/vercel/next.js/blob/canary/contributing/core/testing.md#writing-tests-for-nextjs) - Documentation added - Telemetry added. In case of a feature if it's used or not. - Errors have a helpful link attached, see https://github.com/vercel/next.js/blob/canary/contributing.md ## For Maintainers - Minimal description (aim for explaining to someone not on the team to understand the PR) - When linking to a Slack thread, you might want to share details of the conclusion - Link both the Linear (Fixes NEXT-xxx) and the GitHub issues - Add review comments if necessary to explain to the reviewer the logic behind a change ### What? ### Why? ### How? Closes NEXT- Fixes # -->
1 parent 45e8a6f commit d473eb3

6 files changed

Lines changed: 29 additions & 28 deletions

File tree

package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -110,7 +110,7 @@
110110
"@opentelemetry/api": "1.4.1",
111111
"@picocss/pico": "1.5.10",
112112
"@rspack/core": "1.3.2",
113-
"@rspack/plugin-react-refresh": "1.1.0",
113+
"@rspack/plugin-react-refresh": "1.2.0",
114114
"@svgr/webpack": "5.5.0",
115115
"@swc/cli": "0.1.55",
116116
"@swc/core": "1.9.3",

packages/next-rspack/package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@
88
"types": "index.d.ts",
99
"dependencies": {
1010
"@rspack/core": "1.3.2",
11-
"@rspack/plugin-react-refresh": "1.1.0",
11+
"@rspack/plugin-react-refresh": "1.2.0",
1212
"react-refresh": "0.12.0"
1313
}
1414
}

packages/next/src/build/webpack-config.ts

Lines changed: 13 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -671,15 +671,19 @@ export default async function getBaseWebpackConfig(
671671
'...',
672672
]
673673

674+
const reactRefreshEntry = isRspack
675+
? getRspackReactRefresh().entry
676+
: require.resolve(
677+
`next/dist/compiled/@next/react-refresh-utils/dist/runtime`
678+
)
679+
674680
const clientEntries = isClient
675681
? ({
676682
// Backwards compatibility
677683
'main.js': [],
678684
...(dev
679685
? {
680-
[CLIENT_STATIC_FILES_RUNTIME_REACT_REFRESH]: require.resolve(
681-
`next/dist/compiled/@next/react-refresh-utils/dist/runtime`
682-
),
686+
[CLIENT_STATIC_FILES_RUNTIME_REACT_REFRESH]: reactRefreshEntry,
683687
[CLIENT_STATIC_FILES_RUNTIME_AMP]:
684688
`./` +
685689
path
@@ -705,9 +709,7 @@ export default async function getBaseWebpackConfig(
705709
? {
706710
[CLIENT_STATIC_FILES_RUNTIME_MAIN_APP]: dev
707711
? [
708-
require.resolve(
709-
`next/dist/compiled/@next/react-refresh-utils/dist/runtime`
710-
),
712+
reactRefreshEntry,
711713
`./` +
712714
path
713715
.relative(
@@ -1902,7 +1904,11 @@ export default async function getBaseWebpackConfig(
19021904
isClient &&
19031905
(isRspack
19041906
? // eslint-disable-next-line
1905-
new (getRspackReactRefresh() as any)({ injectLoader: false })
1907+
new (getRspackReactRefresh() as any)({
1908+
injectLoader: false,
1909+
injectEntry: false,
1910+
overlay: false,
1911+
})
19061912
: new ReactRefreshWebpackPlugin(webpack)),
19071913
// Makes sure `Buffer` and `process` are polyfilled in client and flight bundles (same behavior as webpack 4)
19081914
(isClient || isEdgeServer) &&

packages/next/src/build/webpack/config/blocks/base.ts

Lines changed: 1 addition & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -34,8 +34,6 @@ export const base = curry(function base(
3434
if (ctx.isDevelopment) {
3535
if (process.env.__NEXT_TEST_MODE && !process.env.__NEXT_TEST_WITH_DEVTOOL) {
3636
config.devtool = false
37-
} else if (process.env.NEXT_RSPACK) {
38-
config.devtool = 'source-map'
3937
} else {
4038
// `eval-source-map` provides full-fidelity source maps for the
4139
// original source, including columns and original variable names.
@@ -51,14 +49,6 @@ export const base = curry(function base(
5149
(ctx.productionBrowserSourceMaps && ctx.isClient)
5250
) {
5351
config.devtool = 'source-map'
54-
config.plugins ??= []
55-
config.plugins.push(
56-
new DevToolsIgnorePlugin({
57-
// TODO: eval-source-map has different module paths than source-map.
58-
// We're currently not actually ignore listing anything.
59-
shouldIgnorePath,
60-
})
61-
)
6252
} else {
6353
config.devtool = false
6454
}
@@ -69,7 +59,7 @@ export const base = curry(function base(
6959
}
7060

7161
config.plugins ??= []
72-
if (config.devtool === 'source-map') {
62+
if (config.devtool === 'source-map' && !process.env.NEXT_RSPACK) {
7363
config.plugins.push(
7464
new DevToolsIgnorePlugin({
7565
shouldIgnorePath,

packages/next/src/shared/lib/get-rspack.ts

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -20,7 +20,12 @@ export function getRspackReactRefresh() {
2020
gateCanary()
2121
try {
2222
// eslint-disable-next-line import/no-extraneous-dependencies
23-
return require('@rspack/plugin-react-refresh')
23+
const plugin = require('@rspack/plugin-react-refresh')
24+
const entry = require.resolve(
25+
'@rspack/plugin-react-refresh/react-refresh-entry'
26+
)
27+
plugin.entry = entry
28+
return plugin
2429
} catch (e) {
2530
if (e instanceof Error && 'code' in e && e.code === 'MODULE_NOT_FOUND') {
2631
throw new Error(

pnpm-lock.yaml

Lines changed: 7 additions & 7 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

0 commit comments

Comments
 (0)