vite踩坑指北

简单记录下,使用 vite 遇到的一些坑

1. vite 和 element-ui 一同使用的问题

vite 2.2.4 以上版本使用 element UI 会出现该报错cannot read property '$isServer'
原因是因为 2.3.0 版本的 esbuild 编译 elementUI 表现不一致(说到底还是 elementUI 不支持 esModule 的问题)
解决方案可见该 issue: https://github.com/vitejs/vite/issues/3370

1. vite 降级为 2.2.4. vite reinstall -> 2.2.4
2. 使用该插件https://www.npmjs.com/package/esbuild-plugin-vite-element-ui(但是该插件目前有坑,可见作者github)
3. 将 vue、vue-router、vuex 和 elementUI 改为 cdn 方式引入

2. vite-plugin-vue2 插件编译 warn 级别也会抛出异常

类似一些常见的 v-for 未提供 key 之类的 warn 会被 vite-plugin-vue2 认作是异常抛除,导致编译失败
我给作者提了 pr:https://github.com/underfin/vite-plugin-vue2/pull/89

3. vite,当省略文件拓展名和项目别名一起使用时会报错

import App from '@/App'会报错
import App from './App'正常
import App from '@/App.vue'正常
是一个 bug,作者已经修复,待 merge
解决方案和详情可见该 issue:https://github.com/vitejs/vite/issues/3532

TODO 未完待续
有一说一,vite 用起来真的爽,但是目前确实还有不少坑,不过在这飞快的热更新速度面前,不值一提!真香!
Author: liuarui
Link: https://liuarui.github.io/2021/05/31/踩坑/vite/vite踩坑指北/
Copyright Notice: All articles in this blog are licensed under CC BY-NC-SA 4.0 unless stating additionally.