也就是我有一个按照类别放着vue组件的文件夹：views，
还有一个对照vue文件夹结构的markdown文件夹：docs
要如何把它们2个拼在一起，
形成这样的结构：

• vue视图
• markdown说明
• vue文件源码

思路划分为以下几步：

1. 动态生成组件路由映射文件、菜单配置文件
2. 将A.vue和A.md拼接在一起，生成一个新的md文件

如果需要映射的路径不多的话，一个一个配置路径映射没问题，
但是非常麻烦，
因此这里需要在npm run dev/build之前先运行一个node脚本preload.cjs，
（这里之所以将js后缀改为cjs后缀是因为node脚本中使用的是commonJs方式引入包，用于区分Ecma和commonjs的）

preload.cjs需要做这三件事：

• 根据views下的vue文件，生成路径映射文件generated-routes.js，router会从这里读取路径映射
  • 读取路径：src/views/**/*.vue
  • 写入路径 src/router/generated-routes.js
• 同样，生成菜单配置文件，用于生成菜单
  • 读取路径：src/views/**/*.vue
  • 写入路径 src/menu.js
• 生成说明和代码合并后的markdown文件
  • 读取位置：
    • 代码：src/views/**/*.vue
    • md：docs/**/*.md
  • 写入路径：public/markdown

package.json脚本变化：

1
2
3
4

"scripts": {
  "dev": "node preload.js && vite",
  "build": "node preload.js && vite build",
}