在前端开发的过程中，我们使用了很多 npm 包来帮助我们完成某些特定的工作。而 markdown-magic-subpackage-list 就是一种 npm 包，它可以让我们更加方便地管理我们的前端项目中各个子模块的依赖关系。
什么是 markdown-magic-subpackage-list？
markdown-magic-subpackage-list 是一个 npm 包，它可以用于自动生成我们项目中的子模块列表。利用该工具，我们可以将我们的子模块列表自动生成到我们的项目的 README.md 文件中，方便其他人快速查看我们的项目包含哪些子模块以及它们之间的依赖关系。
安装 markdown-magic-subpackage-list
我们可以通过 npm 来安装 markdown-magic-subpackage-list，安装命令如下：
npm install markdown-magic-subpackage-list --save-dev
使用 markdown-magic-subpackage-list
要使用 markdown-magic-subpackage-list，我们需要在项目的 README.md 文件中定义一个占位符来指定我们期望 markdown-magic-subpackage-list 来生成我们的子模块列表。占位符的定义如下：
<!-- subpackages_list -->
添加占位符后，我们需要在项目的根目录下新建一个 subpackages.config.js 的配置文件，并编辑它来指定我们的子模块列表。配置文件的内容如下：
module.exports = {
packages: [
{ name: '@my-project/submodule-1', path: './packages/submodule-1' },
{ name: '@my-project/submodule-2', path: './packages/submodule-2' }
]
};在该配置文件中，我们需要将我们想要在子模块列表中显示的子模块名称和路径都列出来。在上面的例子中，我们列出了两个子模块，分别是 @my-project/submodule-1 和 @my-project/submodule-2。
完成配置文件的编辑后，我们可以在项目的根目录下使用以下命令来生成我们的子模块列表：
markdown-magic README.md
该命令会自动将我们的子模块列表插入到我们在 README.md 文件中指定的占位符位置。完成后，我们就可以在我们的 README.md 文件中看到类似以下的子模块列表了：
@my-project/submodule-1- 这是 my-project 下的某个子模块
@my-project/submodule-2- 这是 my-project 下的另一个子模块
总结
通过使用 markdown-magic-subpackage-list，我们可以更加方便地管理我们的前端项目中各个子模块的依赖关系。我们只需要通过编辑 subpackages.config.js 文件来定义我们的子模块列表，然后使用 markdown-magic 来插入生成的子模块列表到我们的 README.md 文件中即可。这样，其他人在查看我们的项目时就可以更加方便地了解项目的结构和子模块之间的依赖关系了。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/60057bab81e8991b448eb916