# 小小 vite,坑倒不少
首先先说遇到的问题
1.vite 对静态资源的打包方式是什么样
2.vite 图片打包,是不是非得 base64 转码后才能看见
3.vite 为什么不支持 require 写法
# 打包方式
https://vitejs.bootcss.com/guide/assets.html#importing-asset-as-url
先上链接
我们可以知道,确实,图片资源在 vite 中,会被处理为散列名文件名,图片也并不是只有在 base64 下才会被看见 -- 因为都会被处理为散列文件名然后被展示而已,而被 base64 转码的图片仅仅只是其大小小于特定的限定值而已。
# 为什么不支持 require
不支持就是不支持,因为 require 写法在其实是 webpack 本身特有的解析文件方式,vite 没有相关特性。
但是在 vite 的官方文档中给出了解决方法。
针对我这次遇到的图片引入问题,官方给出的解决方法是采用使用 ESM 原生功能 import.meta.url