Can't resolve modules with Next js 13.1.5 #1908
Comments
|
Will this warning persist in the local environment? |
|
I had a similar problem if not the same, after attempting a next 12 > 13 transition today. No error showed on the client console just only on VS console. UI appears to work as should so is this a @ wagmi/@ walletconnect update needed to combat the below error? Anyway this cured it for me:- |
I encountered it initially in local environment. Didn't try adding those packages as @codetaskforce solution states, probably can add those to peer deps? |
|
I'm having this same issue in my local environment. Doesn't seem to affect production builds but the error occurs in the build log as well. |
|
the same issue... @codetaskforce solution seem to fix the dependency issue. |
|
I find another solution if you don't want to install dependencies not related to your project. It works for me. No error shows in the console. |
|
Same issue here... the issue might be related to the bundler not being able to resolve the dependencies properly in a browser environment. However @codetaskforce 's solution works for me as well, so no point in investigating further lol |
|
[+] updated branding: xPortal instead of Maiar, use https://tools.multiversx.com [+] updated config to avoid error logs generated by @WalletConnect ( see more: WalletConnect/walletconnect-monorepo#1908 )
|
It's seems like you guys found a workaround, if the issue persists and you'd like a different solution we can check on wagmi's WalletConnect connector. tldr: Next.js will render your app first on server side, this is triggered when the init function is called in a node.js environment. If you're using ethereum-provider you can call it inside useEffect (which won't run on server side) or by checking that the window object is defined before initializing the ethereum provider. Closing for now as completed. |
• a little hickup w/ Next 13 and App router not playing nice w/ RK WalletConnect/walletconnect-monorepo#1908 • Also, next complained about wagmi usage of "export *" , had to use Viem chain directly • learning about server/client boundaries in next • rainbowkit not styling for some reason, had to import css directly • incorporate Ethena theme colors into rainbowkit
|
@Xiawpohr's solution didn't work for me. This is what worked: const nextConfig = {
webpack: (config, context) => {
if (config.plugins) {
config.plugins.push(
new context.webpack.IgnorePlugin({
resourceRegExp: /^(lokijs|pino-pretty|encoding)$/,
}),
)
}
return config
},
} |
this fixed it for me |
Yeah, it would be nice to fix this for the wagmi connector. It's only going to run client-side so these deps and ignoring them shouldn't be necessary. |
Describe the bug
When trying to use WalletConnectConnector with wagmi in latest Next.js 13.1.5 with experimental appDir enabled compiler throws several warnings, saying: Module not found: Can't resolve
Version
Looking at package-lock there're:
"@walletconnect/ethereum-provider": "^1.8.0",
"@walletconnect/universal-provider": "^2.2.1",
package.json
{
"name": "my-app",
"version": "0.1.0",
"private": true,
"scripts": {
"dev": "next dev",
"build": "next build",
"start": "next start",
"lint": "next lint"
},
"dependencies": {
"ethers": "^5.7.2",
"next": "^13.1.5",
"react": "18.2.0",
"react-dom": "18.2.0",
"wagmi": "^0.11.0"
},
"devDependencies": {
"@types/node": "18.0.1",
"@types/react": "18.0.14",
"@types/react-dom": "18.0.5",
"eslint": "8.19.0",
"eslint-config-next": "12.2.0",
"typescript": "^4.9.4"
}
}
To Reproduce
Steps to reproduce the behavior:
minimal reproducible example
Expected behavior
No warns in the console
The text was updated successfully, but these errors were encountered: