package.json 中的 Root Directory

在开发前端项目时，我们常常需要使用 npm 来管理项目依赖和构建等任务。而在每个 npm 项目的根目录下都会有一个 package.json 文件，其中存储了项目的基本信息、依赖列表、脚本命令等配置信息。另外，在 package.json 文件中还可以设置项目的 Root Directory。

什么是 Root Directory

Root Directory 是指项目的根目录，用来描述项目结构的根路径。当我们通过某些工具或库访问项目文件时，经常需要指定文件的相对路径。如果没有 Root Directory 的概念，则很难确定项目文件的准确路径，并且会出现混乱。

例如，在使用 Webpack 打包项目时，我们需要在配置文件中指定 entry 和 output 路径，如果没有设置 Root Directory，则需要在每个路径前加上相对于配置文件的路径。而如果设置了 Root Directory，则可以直接使用相对于根目录的路径。

如何设置 Root Directory

在 package.json 文件中，可以通过设置 directories 字段来设置 Root Directory。该字段是一个对象，可以包含以下几个属性：

• lib: 用来指定可执行代码所在的目录（一般不建议修改）
• bin: 用来指定可执行文件所在的目录（一般不建议修改）
• man: 用来指定 man 手册所在的目录
• doc: 用来指定文档所在的目录
• example: 用来指定示例代码所在的目录
• test: 用来指定测试代码所在的目录

其中，example 和 test 属性可以用来指定项目的 Root Directory。例如：

{
  "name": "my-package",
  "directories": {
    "example": "examples",
    "test": "tests"
  }
}

上述配置将设置 examples 目录和 tests 目录为 Root Directory。

指导意义和应用场景

设置 Root Directory 可以使得项目文件路径更加清晰和易于维护，特别是对于需要频繁访问项目文件的工具和库，可以减少路径拼接的复杂度和出错的可能性。

另外，在一些开源项目中，也会使用 Root Directory 来简化贡献者的贡献流程。例如，Vue.js 在其官方仓库中使用了 examples 目录作为 Root Directory，让开发者更容易地找到示例代码，并参与贡献。

总之，设置 Root Directory 是一个非常实用的技巧，可以帮助我们更好地管理项目文件，并使得项目更加易于维护。

示例代码

假设有以下项目结构：

./
├── package.json
├── examples/
│   ├── example1.js
│   └── example2.js
└── tests/
    ├── test1.js
    └── test2.js

在 package.json 文件中添加以下配置：

{
  "name": "my-package",
  "directories": {
    "example": "examples",
    "test": "tests"
  }
}

则可以使用相对于 Root Directory 的路径来访问项目文件。例如，在 Webpack 配置文件中可以这样设置 entry 和 output 路径：

module.exports = {
  entry: './examples/example1.js',
  output: {
    filename: 'bundle.js',
    path: './dist'
  }
};

来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/27873