Npm 工作区 - 从根包调用工作区脚本

Question

我正在使用自定义开发脚本处理根 git 存储库中的多个 npm 包来处理启动、编译、构建等。现在我遇到了 npm 工作区，并想在我的以下项目结构中使用这个惊人的新功能，但我无法让它工作：

projectx (root)
- package.json
- apps   
 -- backend
   -- src
   -- package.json (name: @projectx/backend, scripts: "dev":"ts-node or whatever")
 -- common
   -- src
   -- package.json (name: @projectx/common)
 -- frontend
   -- src
   -- package.json (name: @projectx/frontend, scripts: "dev":"webpack")

我的根 package.json 包含：

    {
  "name": "packagex",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "private": "true",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "back:dev": "npm workspace @projectx/backend dev",
    "front:dev": "npm workspace @projectx/frontend dev",
    "dev": "run-p back:dev front:dev"
  },
  "workspaces": [
    "apps/*"
  ],
  "repository": {
    "type": "git",
    "url": "git_url"
  },
  "author": "me",
  "license": "ISC",
  "devDependencies": {
    "npm-run-all": "^4.1.5"
  }
}

现在我想用 npm-run-all 和 root 上的命令启动后端和前端： npm run dev 这导致：

而且我还想与后端和前端共享通用包，在这种情况下应该是可能的。也许其他人也面临同样的问题，或者对我在这里做错了什么有一些想法。

Answer 1

npm@7.7.0 添加了一种从子包/工作区调用脚本的方法，以下是基于您的原始版本的一些示例：

在位于以下位置的所有工作区中运行名为“dev”的脚本apps/backend：

npm run dev -w apps/backend

在所有工作区中运行名为“dev”的脚本：

npm run dev --ws

在名为 的包中运行名为“dev”的脚本@projectx/frontend：

npm run dev -w @projectx/frontend

更多信息：

• 相关变更日志条目：https://github.com/npm/cli/releases/tag/v7.7.0
• 文档：https ://docs.npmjs.com/cli/v7/commands/npm-run-script#workspaces-support
• 博客文章：https://dev.to/ruyadorno/npm-workspaces-npm-run-and-exec-1lg0

Answer 2

您"workspaces"在 package.json 中的属性看起来不错。我正在使用 NPM 工作区，它运行良好，但它仍然缺少很多功能，因此您需要自己进行连接。我也不认为npm worksace是一个命令（但也许是为了未来？），所以这里有一个让它工作的清单：

• 确保您使用的是 Node 15+ 和 NPM 7+
• 将所有 package.json 设置为 "private": true,
• 删除package-lock.json项目中的所有内容，转到根目录，然后npm install. 它应该生成一个根级别package-lock.json，其中包含您工作区的所有依赖项
• 由于您正在使用npm-run-all，请将其添加到您的脚本中：

  "scripts": {
    "back:dev": "cd apps/backend && npm run dev",
    "front:dev": "cd apps/fontend && npm run dev",
    "dev": "npm-run-all build --parallel back:dev front:dev"
  }

然后以npm run dev.

请注意，您可能需要考虑使用start脚本而不是dev缩短您需要键入的命令（例如，npm start而不是npm run dev），但npm run dev仍然可以。

Answer 3

在 root 中，package.json您还可以为每个包添加短名称：

  "scripts": {
    "api": "npm --workspace=@app/api run",
  }

@app/api是一个名字package.json

并从根文件夹中运行脚本，./packages/api如下所示：

npm run api lint
npm run api dev