Skip to content

[Bug] The handling of __webpack_require__ caused a runtime error of React refresh #20139

@Timeless0911

Description

@Timeless0911

Bug Description

src/component.js is similar to a npm library built from webpack which already have __webpack_require__ in code.

When src/component.js is bundled again in webpack, the source code in src/component.js which already have __webpack_require__ symbol is transformed uncorrectly thus causing a runtime error of react refresh.

Image

src/component-new.js behaves well which is as same as src/component.js except replace __webpack_require__ to __my_require__.

src/component.js

Image

src/component-new.js

Image

I suspect this is an issue with react refresh mounting the runtime to webpack_require, where __nested_webpack_require_ is being applied incorrectly in webpack.

Link to Minimal Reproduction and step to reproduce

https://github.com/Timeless0911/webpack-require-issue

Steps:

  1. Run pnpm install
  2. Run pnpm start to see the runtime error in browser
Image
  1. Modify src/index.js
- import { Counter } from "./component";
+ import { Counter } from "./component-new";
  1. Run pnpm start again to see there is no error

Expected Behavior

Component render correctly.

Actual Behavior

Runtime error about react refresh.

Environment

System:
    OS: macOS 15.6.1
    CPU: (10) arm64 Apple M1 Max
    Memory: 4.20 GB / 64.00 GB
  Binaries:
    Node: 22.18.0
    Yarn: 1.22.22
    npm: 10.9.3
    pnpm: 10.22.0
  Browsers:
    Chrome: 142.0.7444.162
    Safari: 18.6
  Packages:
    babel-loader: ^10.0.0 => 10.0.0 
    html-webpack-plugin: ^5.6.5 => 5.6.5 
    webpack: ^5.103.0 => 5.103.0 
    webpack-cli: ^6.0.1 => 6.0.1 
    webpack-dev-server: ^5.2.2 => 5.2.2

Is this a regression?

None

Last Working Version

No response

Additional Context

No response

Metadata

Metadata

Assignees

Labels

Type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions