deep-foundation / deepcase-app

https://deep-foundation.github.io/deepcase-app/
The Unlicense
11 stars 6 forks source link

QueryStoreProvider: Error: NextRouter was not mounted. https://nextjs.org/docs/messages/next-router-not-mounted #280

Closed Konard closed 5 months ago

Konard commented 5 months ago

Screenshot_20240126_010048

Server Error
Error: NextRouter was not mounted. https://nextjs.org/docs/messages/next-router-not-mounted

This error happened while generating the page. Any console logs will be displayed in the terminal window.
Call Stack
useRouter
file:///workspace/dev/node_modules/next/dist/client/router.js (146:15)
QueryStoreProvider
file:///workspace/dev/node_modules/@deep-foundation/store/query.js (42:43)
renderWithHooks
file:///workspace/dev/node_modules/react-dom/cjs/react-dom-server.browser.development.js (5658:16)
renderIndeterminateComponent
file:///workspace/dev/node_modules/react-dom/cjs/react-dom-server.browser.development.js (5731:15)
renderElement
file:///workspace/dev/node_modules/react-dom/cjs/react-dom-server.browser.development.js (5946:7)
renderNodeDestructiveImpl
file:///workspace/dev/node_modules/react-dom/cjs/react-dom-server.browser.development.js (6104:11)
renderNodeDestructive
file:///workspace/dev/node_modules/react-dom/cjs/react-dom-server.browser.development.js (6076:14)
renderContextProvider
file:///workspace/dev/node_modules/react-dom/cjs/react-dom-server.browser.development.js (5920:3)
renderElement
file:///workspace/dev/node_modules/react-dom/cjs/react-dom-server.browser.development.js (6017:11)
renderNodeDestructiveImpl
file:///workspace/dev/node_modules/react-dom/cjs/react-dom-server.browser.development.js (6104:11)
renderNodeDestructive
file:///workspace/dev/node_modules/react-dom/cjs/react-dom-server.browser.development.js (6076:14)
renderNode
file:///workspace/dev/node_modules/react-dom/cjs/react-dom-server.browser.development.js (6259:12)
renderChildrenArray
file:///workspace/dev/node_modules/react-dom/cjs/react-dom-server.browser.development.js (6211:7)
renderNodeDestructiveImpl
file:///workspace/dev/node_modules/react-dom/cjs/react-dom-server.browser.development.js (6141:7)
renderNodeDestructive
file:///workspace/dev/node_modules/react-dom/cjs/react-dom-server.browser.development.js (6076:14)
renderNode
file:///workspace/dev/node_modules/react-dom/cjs/react-dom-server.browser.development.js (6259:12)
renderChildrenArray
file:///workspace/dev/node_modules/react-dom/cjs/react-dom-server.browser.development.js (6211:7)
renderNodeDestructiveImpl
file:///workspace/dev/node_modules/react-dom/cjs/react-dom-server.browser.development.js (6141:7)
renderNodeDestructive
file:///workspace/dev/node_modules/react-dom/cjs/react-dom-server.browser.development.js (6076:14)
renderContextProvider
file:///workspace/dev/node_modules/react-dom/cjs/react-dom-server.browser.development.js (5920:3)
renderElement
file:///workspace/dev/node_modules/react-dom/cjs/react-dom-server.browser.development.js (6017:11)
renderNodeDestructiveImpl
file:///workspace/dev/node_modules/react-dom/cjs/react-dom-server.browser.development.js (6104:11)
renderNodeDestructive
file:///workspace/dev/node_modules/react-dom/cjs/react-dom-server.browser.development.js (6076:14)
renderIndeterminateComponent
file:///workspace/dev/node_modules/react-dom/cjs/react-dom-server.browser.development.js (5785:7)
renderElement
file:///workspace/dev/node_modules/react-dom/cjs/react-dom-server.browser.development.js (5946:7)
renderNodeDestructiveImpl
file:///workspace/dev/node_modules/react-dom/cjs/react-dom-server.browser.development.js (6104:11)
renderNodeDestructive
file:///workspace/dev/node_modules/react-dom/cjs/react-dom-server.browser.development.js (6076:14)
renderNode
file:///workspace/dev/node_modules/react-dom/cjs/react-dom-server.browser.development.js (6259:12)
renderChildrenArray
file:///workspace/dev/node_modules/react-dom/cjs/react-dom-server.browser.development.js (6211:7)
renderNodeDestructiveImpl
file:///workspace/dev/node_modules/react-dom/cjs/react-dom-server.browser.development.js (6141:7)
renderNodeDestructive
file:///workspace/dev/node_modules/react-dom/cjs/react-dom-server.browser.development.js (6076:14)
renderContextProvider
file:///workspace/dev/node_modules/react-dom/cjs/react-dom-server.browser.development.js (5920:3)
renderElement
file:///workspace/dev/node_modules/react-dom/cjs/react-dom-server.browser.development.js (6017:11)
renderNodeDestructiveImpl
file:///workspace/dev/node_modules/react-dom/cjs/react-dom-server.browser.development.js (6104:11)
renderNodeDestructive
file:///workspace/dev/node_modules/react-dom/cjs/react-dom-server.browser.development.js (6076:14)
renderIndeterminateComponent
file:///workspace/dev/node_modules/react-dom/cjs/react-dom-server.browser.development.js (5785:7)
renderElement
file:///workspace/dev/node_modules/react-dom/cjs/react-dom-server.browser.development.js (5946:7)
renderNodeDestructiveImpl
file:///workspace/dev/node_modules/react-dom/cjs/react-dom-server.browser.development.js (6104:11)
renderNodeDestructive
file:///workspace/dev/node_modules/react-dom/cjs/react-dom-server.browser.development.js (6076:14)
renderNode
file:///workspace/dev/node_modules/react-dom/cjs/react-dom-server.browser.development.js (6259:12)
renderChildrenArray
file:///workspace/dev/node_modules/react-dom/cjs/react-dom-server.browser.development.js (6211:7)
renderNodeDestructiveImpl
file:///workspace/dev/node_modules/react-dom/cjs/react-dom-server.browser.development.js (6141:7)
renderNodeDestructive
file:///workspace/dev/node_modules/react-dom/cjs/react-dom-server.browser.development.js (6076:14)
renderContextProvider
file:///workspace/dev/node_modules/react-dom/cjs/react-dom-server.browser.development.js (5920:3)
renderElement
file:///workspace/dev/node_modules/react-dom/cjs/react-dom-server.browser.development.js (6017:11)
renderNodeDestructiveImpl
file:///workspace/dev/node_modules/react-dom/cjs/react-dom-server.browser.development.js (6104:11)
renderNodeDestructive
file:///workspace/dev/node_modules/react-dom/cjs/react-dom-server.browser.development.js (6076:14)
renderIndeterminateComponent
file:///workspace/dev/node_modules/react-dom/cjs/react-dom-server.browser.development.js (5785:7)
renderElement
file:///workspace/dev/node_modules/react-dom/cjs/react-dom-server.browser.development.js (5946:7)
renderNodeDestructiveImpl
file:///workspace/dev/node_modules/react-dom/cjs/react-dom-server.browser.development.js (6104:11)
Konard commented 5 months ago

Workaround 1

image

Comment out call to useRouter hook in /dev/node_modules/[@deep](https://t.me/deep)-foundation/store/query.js and restart deepcase-app.

Konard commented 5 months ago

It is suggested to replace next/router with next/navigation in:

https://nextjs.org/docs/messages/next-router-not-mounted https://stackoverflow.com/questions/74421327/nextrouter-was-not-mounted-next-js

But if I replace next/router with next/navigation it leads to the next error:

[0] Error: invariant expected app router to be mounted

Looks like solution should be done here: https://github.com/deep-foundation/store/blob/main/query.tsx#L24

FreePhoenix888 commented 5 months ago

This problem slows my efficiency

FreePhoenix888 commented 5 months ago

https://github.com/deep-foundation/deepcase-app/commit/d605a5e3ce46b07932aa9a89c0d47a39fc5584e2 is working

Konard commented 5 months ago

Solution

Make sure no packages (for example react and next) have multiple versions installed:

gitpod /workspace/dev (main) $ npm list next
@deep-foundation/dev@0.0.21 /workspace/dev
├─┬ @deep-foundation/deepcase-app@0.1.0-beta.14 -> ./packages/deepcase-app
│ ├─┬ next-env@1.1.1
│ │ └── next@14.1.0
│ └── next@13.3.4
├─┬ @deep-foundation/deepcase@0.0.107 -> ./packages/deepcase
│ └── next@13.3.4
└─┬ @deep-foundation/deeplinks@0.0.330 -> ./packages/deeplinks
  └─┬ @deep-foundation/store@0.0.30
    └── next@14.1.0 deduped

next was updated to 14.1 in both deepcase and deepcase-app

gitpod /workspace/dev (main) $ npm list next
@deep-foundation/dev@0.0.21 /workspace/dev
├─┬ @deep-foundation/deepcase-app@0.1.0-beta.14 -> ./packages/deepcase-app
│ ├─┬ next-env@1.1.1
│ │ └── next@14.1.0 deduped
│ └── next@14.1.0
├─┬ @deep-foundation/deepcase@0.0.107 -> ./packages/deepcase
│ └── next@14.1.0 deduped
└─┬ @deep-foundation/deeplinks@0.0.330 -> ./packages/deeplinks
  └─┬ @deep-foundation/store@0.0.30
    └── next@14.1.0 deduped
FreePhoenix888 commented 5 months ago

Solution

Make sure no packages (for example react and next) have multiple versions installed:

gitpod /workspace/dev (main) $ npm list next
@deep-foundation/dev@0.0.21 /workspace/dev
├─┬ @deep-foundation/deepcase-app@0.1.0-beta.14 -> ./packages/deepcase-app
│ ├─┬ next-env@1.1.1
│ │ └── next@14.1.0
│ └── next@13.3.4
├─┬ @deep-foundation/deepcase@0.0.107 -> ./packages/deepcase
│ └── next@13.3.4
└─┬ @deep-foundation/deeplinks@0.0.330 -> ./packages/deeplinks
  └─┬ @deep-foundation/store@0.0.30
    └── next@14.1.0 deduped

next was updated to 14.1 in both deepcase and deepcase-app

gitpod /workspace/dev (main) $ npm list next
@deep-foundation/dev@0.0.21 /workspace/dev
├─┬ @deep-foundation/deepcase-app@0.1.0-beta.14 -> ./packages/deepcase-app
│ ├─┬ next-env@1.1.1
│ │ └── next@14.1.0 deduped
│ └── next@14.1.0
├─┬ @deep-foundation/deepcase@0.0.107 -> ./packages/deepcase
│ └── next@14.1.0 deduped
└─┬ @deep-foundation/deeplinks@0.0.330 -> ./packages/deeplinks
  └─┬ @deep-foundation/store@0.0.30
    └── next@14.1.0 deduped

Have you solved it by using peer dependencies to not find and solve this problem manually and see dependency conflicts?

Konard commented 5 months ago

@FreePhoenix888 no, it was done using regular dependencies.

https://github.com/deep-foundation/deepcase/commit/b8eca16ba47f5355caed89496307ffd2fd3fe4fa#diff-7ae45ad102eab3b6d7e7896acd08c427a9b25b346470d7bc6507b6481575d519L74

here

https://github.com/deep-foundation/deepcase-app/commit/e4ec1d032ca09374c8a60e773a393b79c186f54e#diff-7ae45ad102eab3b6d7e7896acd08c427a9b25b346470d7bc6507b6481575d519L32

and here

FreePhoenix888 commented 5 months ago

@FreePhoenix888 no, it was done using regular dependencies.

deep-foundation/deepcase@b8eca16#diff-7ae45ad102eab3b6d7e7896acd08c427a9b25b346470d7bc6507b6481575d519L74

here

e4ec1d0#diff-7ae45ad102eab3b6d7e7896acd08c427a9b25b346470d7bc6507b6481575d519L32

and here

Why not peer deps?