vue3中使用require导入图片_vue3 require引入图片

作者：Monodyee | 2024-02-15 19:32:54

踩

vue3 require引入图片

因为vite构建的vue3项目，无法使用require导入图片，需要处理。

官方文档：静态资源处理 {#static-asset-handling} | Vite中文网

1、定义一个require方法


export const require = (imgPath) => {
  try {
    const handlePath = imgPath.replace('@', '..');
    // https://vitejs.cn/guide/assets.html#the-public-directory
    return new URL(handlePath, import.meta.url).href;
  } catch (error) {
    console.warn(error);
  }
};

2.导入到当前页或注册为全局方法使用

声明：本文内容由网友自发贡献，不代表【wpsshop博客】立场，版权归原作者所有，本站不承担相应法律责任。如您发现有侵权的内容，请联系我们。转载请注明出处：https://www.wpsshop.cn/w/Monodyee/article/detail/86308