问题:项目本来是很简单,看网上说把前面路径下的public路径去掉,好,开发环境没问题了,可打包报错。由于在vue-cli4.4时候,在本地的项目中public中加入了一个images文件,结果项目的打包dist在服务器中就是找不到img路径,结果花费了老大很长的时间才解决。
tip这边默认的路径是相对路径,但是服务器的是找不到的,刚开始是在本地/images/...没有问题,服务器的话就不行了,由于服务器需要一个 h5 的文件夹来接受本地的文件,所以配置如下:

先参考一个热心大咖,vue@cli3 项目模板怎么使用public目录下的静态文件


vue.config.js文件配置
module.exports = {
 publicPath: '/h5/'

}
需要使用的页面进行配置
<template>
 <div>
   <div class="imgs" v-for="(v,i) in imagesurl" :key="i">
     <img :src="`${publicPath}${v}`" alt />
   </div>
 </div>
</template>  
<script>
export default {
 // props: {
 //   imageurldata: Array
 // },
 props: ["imageurldata"],
 data() {
   return {
     imagesurl: this.imageurldata,
     publicPath: process.env.BASE_URL
   };
 },
 mounted() {},
 methods: {}
};
</script>
<style scoped lang="scss">
.imgs {
 font-size: 0;
 img {
   width: 100%;
   height: auto;
 }
}
</style>

问题解决,图片出来了

imageurl:[
                "images/039f03d73e6f18f7a1bacafb3ce70654.jpg",
                "images/8089f02b5cb5b6acef4c8acd86c5f0e8.jpg",
                'images/a4f5015e5f8119c9c5eb452c0f3fb7f6.jpg',
                'images/d0ec8a2d7a910fe1af7729666a44555e.jpg'
            ]

yinuo_2
7 声望0 粉丝