私のプロジェクト（NextJS）は正常に機能していましたが、突然ModuleNotFoundErrorの問題が発生しました。特にnextJの動的ルーティングの場合。
それが機能していない私のページ構造pages / programs / [programtype] / [program] .jsx
"mongodb"： "^ 3.5.9"
ModuleNotFoundError: Module not found: Error: Can't resolve 'dns' in 'node_modules/mongodb/lib'
ModuleNotFoundError: Module not found: Error: Can't resolve 'dns' in '/project-path/node_modules/mongodb/lib'
at /project-path/node_modules/webpack/lib/Compilation.js:925:10
at /project-path/node_modules/webpack/lib/NormalModuleFactory.js:401:22
at /project-path/node_modules/webpack/lib/NormalModuleFactory.js:130:21
at /project-path/node_modules/webpack/lib/NormalModuleFactory.js:224:22
at /project-path/node_modules/neo-async/async.js:2830:7
at /project-path/node_modules/neo-async/async.js:6877:13
at /project-path/node_modules/webpack/lib/NormalModuleFactory.js:214:25
at /project-path/node_modules/enhanced-resolve/lib/Resolver.js:213:14
at /project-path/node_modules/enhanced-resolve/lib/Resolver.js:285:5
at eval (eval at create (/project-path/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:13:1)
at /project-path/node_modules/enhanced-resolve/lib/UnsafeCachePlugin.js:44:7
at /project-path/node_modules/enhanced-resolve/lib/Resolver.js:285:5
at eval (eval at create (/project-path/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:13:1)
at /project-path/node_modules/enhanced-resolve/lib/Resolver.js:285:5
at eval (eval at create (/project-path/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:25:1)
at /project-path/node_modules/enhanced-resolve/lib/DescriptionFilePlugin.js:67:43
これは、nextjsのサーバーサイドコードに関する実際の微妙な問題です。
エラーは明らかです。クライアント側のコードでサーバー側のコード（mongoクエリ）を実行しようとしています。あなたが間違ったコードを持っていないと確信しているので、明らかではないのは原因です...
デバッグの結果、mongoコードをインポートして使用しないと、このエラーがスローされることがわかりました。それを回避する方法を理解するには、以下を参照してください。
したがって、これは正常に機能します。
import { findUsers } from '../lib/queries'
function Home({ users }) {
return (
<h1>Users list</h1>
//users.map and so on...
)
}
export async function getServerSideProps() {
const users = await findUsers()
return {
props: {
users: users
}
}
}
export default Home
これはエラーをスローしますが：
import { findUsers } from '../lib/queries'
function Home({ users }) {
return (
<h1>Users list</h1>
//users.map and so on...
)
}
export async function getServerSideProps() {
// call disabled to show the error
// const users = await findUsers()
return {
props: {
users: [] //returned an empty array to avoid other errors
}
}
}
export default Home
このエラーを回避するには、ちょうどあなたのコンポーネント内の任意のサーバー側のコードのインポートを削除し、あなたが使用していない場合には、それをgetServerSideProps。
この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。
侵害の場合は、連絡してください[email protected]
コメントを追加