vue中引入静态图片

vue+webpack中，可以使用require
 imageList: [
      {
          url: require('../image/pig.png')
      }
    ]

vue+vite没有require方法
// 静态图片一般放在src/assets下面
 
1. 单个文件
import pig from '@/assets/images/pig.png'
 
<img :src="pig " />
 
2. 多个文件 new URL() + import.meta.url
   vite文档： https://cn.vitejs.dev/guide/assets.html#new-url-url-import-meta-url
   1.  在utils中创建一个方法getImage.js
   // 获取assets静态资源
      const getAssetsFile = (url) => {
          return new URL(`../assets/deliveryStrategyImages/${url}`, import.meta.url).href;
      };
      export default getAssetsFile;
   2. 使用

        import getAssetsFile from '@/utils/getImage';

        iconImg: [

        {

          img: getAssetsFile('oneDeployment.svg'),

        },