首先如果是小项目打包和启动时间时间不是特特特特别长的就直接改装vue3吧,目前这个项目是页面经过了无数人的摧残,各种写法技术,真的是八仙过海,各显神通,启动时间一分钟左右,打包时间超过了5分钟。。搞得我是欲仙欲死,本来一直都是能跑起来就行的心态,这不是有点时间了。这个问题又开始在我的脑袋里面不断的蹦跶,那就来吧,不是你死就是你死。
第一步:先创建个vite的项目,这是个废话 ,能看到我的这个文章的基本都已经创建好了。如果没有那就去搜下怎么创建vite+vue2很多。万里长征第一步,你已经在作死的道路上越走越远,那就话不多说了。上干货。
第二步:webpack是支持require,所以很多webpack的项目中或多或少的都用到了require,那先让vite支持require。安装 vite-plugin-require
npm install vite-plugin-require
vite.config里面搞起来
import requirePlugin from 'vite-plugin-require'
plugins:[
requirePlugin(),
]
第三步:vite里面没有组件页面没有‘.vue’是不行的,这个真是一个大坑,但是你又没办法,一个个改,心里千万个羊驼飘过~~~,这是事吗 ,娶你妹的。。。
嗯改完了,很不错。
第四步:图片加载。你就算支持了require,但是在img的标签上使用还是会报错,这是事吗,干就完了,查了半天的资料,刨了不少祖坟,我被狠狠蹂躏了几次以后,
Vue.prototype.getAssetFile = (path)=>{
return new URL(`./assets/image/${path}`, import.meta.url).href
}