Error: Invalid hook call. Hooks can only be called inside of the body of a function component.

[nickytonline]

What version of million are you using?

0.0.73

Are you using an SSR adapter? If so, which one?

Netlify

What package manager are you using?

npm

What operating system are you using?

Mac

What browser are you using?

Arc

Describe the Bug

If I run npm run dev, the PR code that I'm reviewing works fine with no invalid hook call errors. If I run the dev server with Million lint, I get the following error:

Unhandled Runtime Error
Error: Invalid hook call. Hooks can only be called inside of the body of a function component. This could happen for one of the following reasons:
1. You might have mismatching versions of React and the renderer (such as React DOM)
2. You might be breaking the Rules of Hooks
3. You might have more than one copy of React in the same app
See https://reactjs.org/link/invalid-hook-call for tips about how to debug and fix this problem.

126 | function CustomTick(_props6) {
  127 | let _props3 = _props6;
> 128 | /*million ignore*/_captureProps2(1058525330072756, _props6, [98, 20, 98, 27], 0);
      |                                 ^
  129 | /*million ignore*/_useMount2("/Users/nicktaylor/dev/work/app/components/Graphs/ContributorsChart.tsx", "CustomTick");
  130 | let {
  131 |   x,

If you want to see the error in action:

1. Clone the open-sauced/app repo, gh clone open-sauced/app
2. Pull down PR #3302, gh co 3302
3. Install dependencies, npm run install
4. Run npm run dev.
5. Navigate to http://localhost:3000/s/remix-run/remix
6. The page loads fine.
7. Stop the dev server.
8. Run USE_MILLION_LINT=1 npm run dev
9. Navigate to http://localhost:3000/s/remix-run/remix
10. The million lint dev toolbar loads as well as the page and then it errors out immediately.

I have no idea why it's erroring out at the moment, but happy to help work on this if needed.

What's the expected result?

The Next.js dev server with Million Lint running loads the page instead of erroring out

Link to Minimal Reproducible Example

https://stackblitz.com/~/github.com/open-sauced/app

Participation

• I am willing to submit a pull request for this issue.

[github-actions]

Thanks for opening this issue! A maintainer will review it soon.

[tobySolutions]

Hmm, thank you very much for this @nickytonline; taking a look now.

[github-actions]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs within the next 7 days.

[NisargIO]

Hi @nickytonline, we've just deployed a fix for you. Can you try running the setup script npx million@latest? Once it's done, please restart your VSCode/Cursor. Let me know if that works for you!