在 npm 本地包中找不到下一个 js webpack 模块

Next js webpack module not found in npm local package

我正在制作一个 Next Js 应用程序,它在本地 npm 包中有猫鼬模型,因此它们可以与后端的其他部分共享。但是我收到了这些错误:

Module not found: Can't resolve 'supports-color' in '/Users/akopyl/Projects/my-project/shared-stuff/node_modules/debug/src'

../shared-stuff/node_modules/mongodb/lib/bson.js
Module not found: Can't resolve 'bson-ext' in '/Users/akopyl/Projects/my-project/shared-stuff/node_modules/mongodb/lib'

../shared-stuff/node_modules/mongodb/lib/deps.js
Module not found: Can't resolve 'kerberos' in '/Users/akopyl/Projects/my-project/shared-stuff/node_modules/mongodb/lib'

../shared-stuff/node_modules/mongodb/lib/deps.js
Module not found: Can't resolve 'snappy' in '/Users/akopyl/Projects/my-project/shared-stuff/node_modules/mongodb/lib'

../shared-stuff/node_modules/mongodb/lib/deps.js
Module not found: Can't resolve 'snappy/package.json' in '/Users/akopyl/Projects/my-project/shared-stuff/node_modules/mongodb/lib'

../shared-stuff/node_modules/mongodb/lib/deps.js
Module not found: Can't resolve 'aws4' in '/Users/akopyl/Projects/my-project/shared-stuff/node_modules/mongodb/lib'

../shared-stuff/node_modules/mongodb/lib/encrypter.js
Module not found: Can't resolve 'mongodb-client-encryption' in '/Users/akopyl/Projects/my-project/shared-stuff/node_modules/mongodb/lib'

我的猜测是,这是由于 webpack 试图在 my-project/app 目录而不是 my-project/shared-stuff 目录中查找 shared-stuff 包的依赖项造成的。

项目文件结构:

my-project
├── app (This is the Next Js app that has errors)
│   ├── lib
│   ├── next.config.js
│   ├── node_modules
│   ├── package-lock.json
│   ├── package.json
│   ├── pages
│   ├── public
│   └── styles
├── gather
│   ├── ecosystem.config.js
│   ├── node_modules
│   ├── package-lock.json
│   ├── package.json
│   └── src
└── shared-stuff
    ├── index.js
    ├── models
    ├── node_modules
    ├── package-lock.json
    └── package.json

app/package.json 文件:

{
  "private": true,
  "scripts": {
    "dev": "next dev",
    "build": "next build",
    "start": "next start"
  },
  "dependencies": {
    "mongoose": "^6.2.6",
    "next": "latest",
    "react": "^17.0.2",
    "react-dom": "^17.0.2",
    "sass": "^1.49.9",
    "shared-stuff": "file:../shared-stuff"
  },
  "devDependencies": {
    "eslint": "^8.11.0",
    "eslint-config-next": "^12.1.0"
  }
}

shared-stuff/package.json 文件:

{
  "name": "shared-stuff",
  "version": "1.0.0",
  "main": "index.js",
  "dependencies": {
    "mongoose": "^6.2.6"
  }
}

还有一件有趣的事情我注意到,虽然两个包都只有 mongoose 作为依赖项,但 shared-stuff/node_modules 文件夹包含一个 mongodb 文件夹,但 app/node_modules 没有't.

gather 目录中的另一个包也有 shared-stuff 作为依赖项,但它按预期运行,因为它不使用 webpack。

我在 3 个项目中的每个项目中都 运行 npm ci,尝试禁用 eslint,尝试使用 next.config.js 中的 webpack.IgnorePlugin 来忽略 shared-stuff,但没有成功。

所以我找到的解决方案是将父目录 my-project 初始化为 npm 项目本身,并将子文件夹定义为其 workspaces.

my-project $ npm init -y
my-project $ npm install

然后将以下行添加到 my-project/package.json:

"workspaces": ["./app", "./gather", "./shared-stuff"]

完成这些步骤后,本地文件夹包的依赖关系已正确解析。