vue中引入绝对路径报错是什么原因？（解决方法）

vue中引入绝对路径报错是什么原因？下面web建站小编给大家详细介绍一下解决方法！

报错原因：

typescript不支持require所以之前直接用imgUrl: require(’…/assets/pic.png’)调用！

解决方法：

<template>
  <img  v-for="item in imgList" :src="getAssetsImages(item.url)" alt="">
</template>
  
<script>
  import {ref, reactive, onMounted} from "vue";
  export default {
    name: "imgPage",
    setup(){
      imgList = reactive([
         {url: 'a.png'},{url: 'b.png'},{url: 'c.png'}
      ])
      const getAssetsImages =(name)=> {
        return new URL(`/src/assets/pic/${name}`, import.meta.url).href; //本地文件路径
      }
      return{
      imgList,
        getAssetsImages 
      }
   }
}
</script>

vue项目开发中一般会出现哪些报错？（vue常见的10种错误）

Vue项目开发中报“TypeError: Cannot read property 'yyy' of null”错误怎么解决？

vue3如何解决store.state.count错误的取值

vue项目报“vue/html-indent”等错误解决方法

vue项目报“vue/html-closing-bracket-spacing”等错误解决方法

标签： vue报错

上面是“vue中引入绝对路径报错是什么原因？（解决方法）”的全面内容，想了解更多关于 vuejs 内容，请继续关注web建站教程。

当前网址：https://m.ipkd.cn/webs_3440.html

声明：本站提供的所有资源部分来自互联网，如果有侵犯您的版权或其他权益，请发送到邮箱：admin@ipkd.cn，我们会在看到邮件的第一时间内为您处理！