前言
经常看到有些伙伴问，多工程如何共享一套组件库，而且组件库本身还允许多人维护。
于是有人就说了，把组件库维护成NPM包，但显然，很繁琐。
又有人说了，用webpack5 Module Federation，但是这玩意又是学习成本，也不够简单。
其实并不需要那么复杂，我今天提供一套方案。
思路
首先说，组件库的引入，是可以跨盘符引入的，也就是import HelloWorld from 'H:/sharedComponents/HelloWorld';是可用的。
现在简单了，无论你组件库放在哪里，直接引用它就完事了。
那么有个问题就是，甲同事的组件库放在H:/sharedComponents，乙同学放在D:/codes/sharedComponents，那么import的路径就无法保证统一，怎么办呢？
也简单，每个人维护自己的.env.local环境配置文件即可。
实施
- 给一个Vue项目创建.env文件，写入：
VUE_APP_SHARED_COMPONENTS_PATH = 'D:/sharedComponents'
- 再创建.env.local文件，写入：
VUE_APP_SHARED_COMPONENTS_PATH = 'D:/codes/sharedComponents'
这样，默认存放路径是D盘下的sharedComponents目录，如果你创建了.env.local，则.env.local优先级高，最后得到的路径是'D:/codes/sharedComponents'。.env.local会被git忽略，不会提交到的仓库。
- 给Vue项目写一个全局常量文件@/utils/const.js，内容比如：
export default {
sharedComponentsPath: process.env.VUE_APP_SHARED_COMPONENTS_PATH,
}
- 修改import语句
原来是：
import HelloWorld from 'H:/sharedComponents/HelloWorld';
现在改成：
import { sharedComponentsPath } from '@/utils/const';
import HelloWorld from sharedComponentsPath + '/HelloWorld';
- 给其他Vue项目也做同样的操作。
维护组件库
组件库存入独立的git仓库即可，没什么可说的。
对组件库的修改可以在Vue项目直接看到效果，跟存放在项目目录没任何差异。
最后提醒一下，你要确保修改组件之后，对所有项目的兼容性，如果有破坏性的修改，需要把引用它的所有项目都对应改正。
那么如何知道哪些项目的哪些文件引用了我改的组件呢？方法有很多，简单的，比如在几个项目中搜索sharedComponentsPath + '/HelloWorld'。
