参考: https://juejin.cn/post/7009441745301667853
方法一:配置alias
//app.vue
<img src="/images/logo.png" alt="" />
//vite.config.js
import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
export default defineConfig({
base: './',
plugins: [vue()],
resolve: {
alias: {
'/images': 'src/assets/images',
},
},
})
方法二:封装函数
//utils.js
const getSrc = (name) => {
if (typeof name === 'undefined') return 'error.png'
const path = `/src/assets/images/${name}.png`
const modules = import.meta.globEager('/src/assets/images/*')
return modules[path]?.default
}
//app.vue
<img :src="getSrc('about')" alt="" />
标签:vue,const,images,alias,引入,import,vite
From: https://www.cnblogs.com/openmind-ink/p/17264626.html