Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

$RefreshReg$ is not defined in web worker after upgrading to 9.4.0 #12753

Closed
Jarred-Sumner opened this issue May 11, 2020 · 7 comments · Fixed by #15145
Closed

$RefreshReg$ is not defined in web worker after upgrading to 9.4.0 #12753

Jarred-Sumner opened this issue May 11, 2020 · 7 comments · Fixed by #15145
Assignees
Milestone

Comments

@Jarred-Sumner
Copy link

Jarred-Sumner commented May 11, 2020

Bug report

I believe this is a React Refresh-related issue.

Potentially relevant:

Describe the bug

After upgrading to Next.js 9.4.0, workers throw the following exception on load:

Uncaught ReferenceError: $RefreshReg$ is not defined
    at Module.eval (blocks.ts:239)
    at eval (blocks.ts:296)
    at Module../shared/blocks.ts (48ba4b417edc794a158b.worker.js:311)
    at __webpack_require__ (48ba4b417edc794a158b.worker.js:29)
    at Module.eval (WorldChunk.ts:12)
    at eval (WorldChunk.ts?c4f7:22)
    at Module../lib/Data/WorldChunk.ts (48ba4b417edc794a158b.worker.js:115)
    at __webpack_require__ (48ba4b417edc794a158b.worker.js:29)
    at Module.eval (WorldChunkReader.worker.ts?024a:1)
    at eval (WorldChunkReader.worker.ts?024a:21)

To Reproduce

  1. Configure worker-loader like so in next.config.js:
config.module.rules.unshift({
  test: /\.worker\.(js|ts|tsx)$/,
  loader: "worker-loader",
  options: {
    name: "static/[hash].worker.js",
    publicPath: "/_next/",
  },
});

// Overcome webpack referencing `window` in chunks
config.output.globalObject = "self";
  1. Load a worker
  2. See error

Expected behavior

No error, workers load successfully as in Next 9.3

Screenshots

image
image

System information

  • OS: macOS
  • Browser (if applies) Chrome
  • Version of Next.js: 9.4.0
  • Version of Node.js: 13.12.0
@Timer Timer modified the milestones: 9.4.1, 9.4.2 May 12, 2020
@Timer Timer modified the milestones: 9.4.2, 9.4.3 May 20, 2020
@Jarred-Sumner
Copy link
Author

Jarred-Sumner commented May 25, 2020

In my case, I was able to work around this issue by ensuring that there is no direct overlap between:

  • Modules imported in React components
  • Modules imported in Worker bundles

@next/react-refresh-utils thought it was a React Refresh boundary, so it adds its metadata to the file. That metadata breaks workers since React isn't in the worker (though if you import * as React in the worker it still doesn't work). So you need to find a way to make it not think there are React Refresh boundaries in the workers.

This isn't a great fix because it meant moving functions to a bunch of individual files

@Timer Timer modified the milestones: 9.4.3, 9.4.4 May 28, 2020
@Jarred-Sumner
Copy link
Author

I ran into this issue again and couldn’t use the previous workaround.

This time, I worked around it by renaming exported functions that are shared between React and Worker code to have a number in the function name 😅. This causes the heuristic for checking whether or not something is potentially a React component to return false (which is what React Refresh uses for refresh boundaries).

@Timer Timer modified the milestones: 9.4.5, 9.x.x Jun 27, 2020
@Timer Timer self-assigned this Jun 27, 2020
@Timer
Copy link
Member

Timer commented Jun 27, 2020

Can someone please provide a clonable complete reproduction so we can look into this?

@Timer Timer added please add a complete reproduction Please add a complete reproduction. and removed type: needs investigation labels Jun 27, 2020
@Jarred-Sumner
Copy link
Author

@Timer here you go: https://github.com/Jarred-Sumner/repro-refreshregistry

image

@Timer Timer modified the milestones: 9.x.x, iteration 4 Jun 29, 2020
@utxo-detective
Copy link

utxo-detective commented Jul 3, 2020

I began seeing this same issue when I upgraded to next 9.4 from 9.3. It's only impacting dev for me, when I deployed it to vercel, the error was not there

@adriancooney

This comment has been minimized.

@Timer Timer modified the milestones: iteration 4, iteration 5 Jul 13, 2020
@Timer Timer added point: 3 and removed please add a complete reproduction Please add a complete reproduction. labels Jul 14, 2020
@balazsorban44
Copy link
Member

This issue has been automatically locked due to no recent activity. If you are running into a similar issue, please create a new issue with the steps to reproduce. Thank you.

@vercel vercel locked as resolved and limited conversation to collaborators Jan 29, 2022
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

Successfully merging a pull request may close this issue.

5 participants