vue.config.js
一、别名配置
const path = require("path");
const resolve = dir => path.join(__dirname, dir)
module.exports = {
chainWebpack: (config) => {
config.resolve.alias // 添加别名
.set('@', resolve('src'))
.set("@libs",resolve('src/libs'))
.set('@pages', resolve('src/pages'))
.set('@static', resolve('src/static'))
}
}
主义resolce是对路径的一个拼接,
.set(’@’, resolve(‘src’))
不要再src后边再配置"/"
所以正常找图片就是
@/assets/…
二、本地和网络图片显示
(1) 本地图片显示
如果是默认显示的话就可以了
<img src="@/assets/...">
如果是动态加载,为了和让webpack能和v-bind区分,需要加上require
data里:
let img = require("@assets/...")
<img :src="img">
(2)网络图片
直接赋值就可以了
<img :src="your url">