关于前端:vue3vite-assets动态引入资源文件

之前在Vue2中须要动静获取门路时，应用require来获取，但在vue3中应用require会报require is not defined的错，上面将具体解说在vue3中正确的动静获取门路的形式。

require动静引入报错是因为require是属于webpack办法

办法一： 实用于解决多个资源文件

举荐，这种形式能够动静传入所需文件门路

底层原理：动态资源解决 | Vite 官网中文文档
new URL() + import.meta.url

// 获取图片门路

const getAssetsImage = (name: string) => {  return new URL(`/src/assets/newHome/${name}`, import.meta.url).href}

办法二： 引入图片门路参加编译（实用于单个资源文件）

import img1 from '@/assets/newHome/img1.png'import img2 from '@/assets/newHome/img2.png'import img3 from '@/assets/newHome/img3.png'