vite预构建，加速dev模式下热更新

一、先说结论

没有预构建之前

预构建之后

最近修改一个项目保存的时候老是觉得刷新很慢，又是一个多页面的vue项目，HMR链路已经被断了，每次保存都要等个几秒才能看到变化【暴躁ing】 查看network发现每次刷新都加载了很多模块，导致页面刷新缓慢,类似

说明 Vite 只把 单独这一个子文件 当新依赖，现转译、现返回，没有把它打进“antd 整体预构建包” 。 解决方案（懒人做法，我用的window） 在 window CMD中输入：

set DEBUG=vite:deps && npm run dev

MAC Linux则在bash输入:

DEBUG=vite:deps npm run dev

这时候cmd会出现

将这些都复制进vite.config.js/ts 中的optimizeDeps.include 进行预构建并重启服务，类似

optimizeDeps: {
  include: [
     'ant-design-vue',
     'ant-design-vue/es/alert',
     'ant-design-vue/es/alert/style',
     'ant-design-vue/es/anchor/style',
     'ant-design-vue/es/avatar',
  ]
}

这个时候vite会为这些依赖进行预构建 这时候查看netword，资源加载会出现

说明已经被打进vite预构建中，加载速度加快。