package.json配置详解,让你一看就会(下)

4,021 阅读3分钟

我们接着上一篇来讲:

workspaces

npm Docs中是这样定义的: 是一个包含文件路径的数组,在安装依赖的时候,会查找每一个工作区,将这些工作区的的依赖连接到项目根目录下的node_modules中。

在以下示例中,只要文件夹packages中包含有效的package.json文件,则位于该文件夹内的所有文件夹都将被视为一个工作区:

{
  "name": "workspace-example",
  "workspaces": [
    "./packages/*"
  ]
}

定义工作区

工作区通常通过文件的workspaces属性 定义package.json,例如:

{
  "name": "my-workspaces-powered-project",
  "workspaces": [
    "workspace-a"
  ]
}

该目录包含一个名为workspace-a的文件夹,该文件夹本身包含一个package.json内部,定义一个 Node.js 包,例如:

+-- package.json
`--工作区-a
   `--package.json

一旦npm install在当前工作目录中运行,预期的结果.是该文件夹workspace-a将被符号链接到node_modules当前工作目录的 文件夹。


创建工作区

我们在根目录下添加一个名为packagesTest的工作区,执行命令后,就会在根目录下新增一个packagesTest文件夹(包含package.json)

npm init -w ./packagesTest

向工作区添加依赖

 npm install jquery -w a

往工作区a 中添加jquery依赖

在工作区上下文中运行命令

您可以使用workspace配置选项在已配置工作区的上下文中运行命令

// 执行a工作区的test命令
npm run test --workspace=a
// 执行a,b工作区的test命令
npm run test --workspace=a --workspace=b
// 也可以使用`workspaces`(复数)配置选项来启用相同的行为,在所有工作区中执行test命令
npm run test --workspaces

扩展

yarn workspace

在yarn 中使用工作区和在npm 中使用是非常类似的,但是需要一个private字段

{
  "private": true,
  "workspaces": ["workspace-a", "workspace-b"]
}

请注意,private: true是必需的!工作区不打算发布,因此添加此安全措施以确保没有任何事情会意外暴露它们 这时候,我们安装依赖的时候就变成了yarn install

一些常用命令

// 列工作区
yarn workspaces info

// 添加依赖
// yarn workspace <workspace_name> add <packageName>  
yarn workspace workspace-a add react react-dom --dev

// 移除依赖
// yarn workspace <workspace_name> remove <packageName>  
yarn workspace workspace-a remove react-dom --save

pnpm workspace

在根目录中需要有一个文件pnpm-workspace.yaml

pnpm-workspace.yaml定义工作区的根目录,并使您能够从工作区中包含/排除目录。默认情况下,包含所有子目录的所有包。 例如(将test文件作为工作区)

    packages:
     - 'test/**'

说到这里就不得不提一下 Monorepo, Monorepo 是管理项目代码的一个方式,指在一个项目仓库 (repo) 中管理多个模块/包 (package)。是不是感觉跟workspaces很像,其实我也觉得差不多,monorepo 最主要的好处是统一的工作流Code Sharing。 统一修改,统一测试、统一发版。只要搭建一套脚手架,就能管理(构建、测试、发布)多个 package

最常见的 monorepo 解决方案是 Lerna 和 yarn 的 workspaces 特性。感兴趣的同学可以了解一下。