问题
vue 项目打包,项目中引用了的图片没有被打进包里,导致打包后的项目图片缺失。
解决方法
1、在导入图片的文件中通过 import 引入图片
这种方法只适合图片少的情况
<template>
<img :src='testImg'/>
</template>
<script>
import testImg from '@/assets/img/testImg.png'
</script>
2、封装公共方法,通过 new URL() 的方式获取图片
const getImg = (url: string) => {
return new URL(`../assets/img/${
url}`, import.meta.url).href;
};
const testImg = getImg('testImg')