vite技术揭秘--alias

2022-09-29 本文已影响0人习惯水文的前端苏

$\bullet$ 前言

alias作为锦上添花的东西，不仅能提高开发效率，也有利于后续迭代维护

在看源码前，我的思路是这样的

写一个插件对源码内容做匹配，当发现有同名时做下替换，如遇到'UTILS/index'就替换成一个绝对路径:"C:\user\xxx\projectName\src\utils\index"

$\bullet$ 示例

$\bullet$ 源码

$\ast$ 统一配置格式

既然它作为配置的一部分，就肯定和proxy的获取流程大差不差，总而言之，我们顺利的拿到了alias配置

拿到之后，会先与vite内置别名做下合并

最终，它会将所有的别名格式化为有find和replacement作为键名的对象所组成的数组

其中find为别名标识，replacement为别名对应的文件绝对路径

$\ast$ 调用插件，转换请求路径

既然已经统一了别名格式，那在收到文件拉取请求的时候调用对应的插件，对路径做下转换，理论上就大功告成了

这一行为应当发生在接收到文件请求时，显然vite提供的resolveId钩子最合适做这件事

此时，我们就只需要去拉取已经被转换的路径就好啦