一 加载静态资源
在第一次使用vue3开发项目时,使用require(‘图片路径’),结果浏览器报错:
Uncaught (in promise) ReferenceError: require is not defined
因为require是webpack提供的一种加载能力,但是vue3项目时搭配vite的,所以这里应该用vite提供的静态资源载入方法,
官方文档:https://vitejs.cn/guide/assets.html#the-public-directory
将上面的require改为new URL这种格式,页面就可以正常加载静态资源了
<img :src="image" />
const image = new URL('@/static/images/error.svg', import.meta.url).href


![[SDK]-菜单 和 树控件](https://i-blog.csdnimg.cn/direct/65e4fe26c85b4a488556847f2729bc41.gif)





![[基于 Vue CLI 5 + Vue 3 + Ant Design Vue 4 搭建项目] 01 安装 nodejs 环境](https://i-blog.csdnimg.cn/direct/662a16f0307f452daa8a84a11f9b1cbb.png#pic_center)











