1。data数据里的写法:
js里的应该是要写成 url: require('../../assets/workbench/')
如:
<script>
export default {
name: 'hello',
data () {
return {
msg: 'Welcome to Yrrrrrrrf对p',
visible:false,
show2:true,
list:[
{'pic':'01','src':require('../assets/detail/')},
{'pic':'02','src':require('../assets/detail/')},
{'pic':'03','src':require('../assets/detail/')}
]
}
}
}
</script>
//html:
<el-carousel-item v-for="item in list" :key="">
<img :src="" alt="">
</el-carousel-item>
.
其他情况,图片无法处理:引入第三方插件库,比如swiper,,用require会报错。而导致build项目上线,图片无法加载
则将图片文件放到static目录下。图片文件引入。写法:
swiperList:[ {'pic':'01','src':'static/img/'}, {'pic':'02','src':'static/img/'}, {'pic':'03','src':'static/img/'} ],这里路径从写起。而非引用图片的组件页面。
3.配置方案:
build目录下找到中的({}),里面添加
publicPath: '../../'
这个属性就完美解决了