Skip to content
New issue

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

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

Already on GitHub? # to your account

Nextjs with useRouter #2331

Open
GubanovSergey opened this issue Dec 29, 2023 · 3 comments
Open

Nextjs with useRouter #2331

GubanovSergey opened this issue Dec 29, 2023 · 3 comments

Comments

@GubanovSergey
Copy link

Describe the bug

https://previewjs.com/docs/guides/nextjs

npm i previewjs/config-helper-nextjs doesn't work since the repo is not publicly available.
Using custom implementation below the automatic results in an error:

TypeError: Cannot redefine property: default
at Function.defineProperty ()
at http://localhost:3140/__previewjs__/Wrapper.tsx?import&t=1703848410741:6:8

Reproduction

  1. const router = useRouter() will give an error that router is not mounted
  2. Defined previewjs folder with Wrapper.tsx file.
  3. Code from the link above

Preview.js version

v1.27.3

Framework

^18

System Info

System:
    OS: Windows 11 10.0.22621
    CPU: (16) x64 12th Gen Intel(R) Core(TM) i5-12500H
    Memory: 1.48 GB / 15.73 GB
  Binaries:
    Node: 20.10.0 - C:\Programs\nextjs\node.EXE
    npm: 10.2.5 - C:\Programs\nextjs\npm.CMD
  IDEs:
    VSCode: 1.85.1 - C:\Programs\Microsoft VS Code\bin\code.CMD
    Visual Studio: 17.7.34221.43 (Visual Studio Community 2022)
  Browsers:
    Edge: Chromium (119.0.2151.97)
    Internet Explorer: 11.0.22621.1

Used Package Manager

npm

Extension logs (useful for crashes)

No response

Preview logs (useful for rendering errors)

No response

Repo link (if available)

No response

Anything else?

No response

@fwouts
Copy link
Owner

fwouts commented Jan 2, 2024

Hi @GubanovSergey, I wonder if you forgot the @ in your NPM command:

npm i @previewjs/config-helper-nextjs

Which version of Next are you using?

@gabimoncha
Copy link

Hey @fwouts. I have the same issue. I'm using next with SVGR. I've followed the install guide accordingly. Have the __previewjs__/Wrapper.tsx and the preview.config.js files
Still get the same error.

I've have installed the following deps:
Screenshot 2024-01-05 at 14 40 33

"dependencies": {
    "@svgr/webpack": "^8.1.0",
    "next": "^13.5.4",
    "svg-url-loader": "^7.1.1",
},
"devDependencies": {
    "@previewjs/config": "^5.2.3",
    "@previewjs/config-helper-nextjs": "^1.0.26",
    "vite-plugin-react-svgr": "^1.0.1",
}

@MbBrainz
Copy link

MbBrainz commented Jan 9, 2024

Im experiencing the same issue using nextjs, react and chakra-ui

# for free to join this conversation on GitHub. Already have an account? # to comment
Projects
None yet
Development

No branches or pull requests

4 participants