【摘要】 文件路径的引用问题(配置文件路径vue.config.js)考必过小编为大家整理了关于文件路径的引用问题(配置文件路径vue.config.js)的信息,希望可以帮助到大家!
文件路径的引用问题(配置文件路径vue.config.js)
标签:不显示没有文件路径src模块codelogvueviews
在项目根目录下创建vue.config.js文件
vue.config.js内容:
const path = require(‘path‘);//引入path模块 function resolve(dir){ return path.join(__dirname,dir)//path.join(__dirname)设置绝对路径 } modpe.exports={ chainWebpack:(config)=>{ config.resolve.apas //set第一个参数:设置的别名,第二个参数:设置的路径 .set(‘@‘,resolve(‘./src‘)) .set(‘components‘,resolve(‘./src/components‘)) .set(‘assets‘,resolve(‘./src/assets‘)) .set(‘views‘,resolve(‘./src/views‘)) .set(‘network‘,resolve(‘./src/network‘)) //注意 store 和 router 没必要配置 } }
配置好想用的路径别名后,重新启动项目,再引入文件时,使用别名即可。
配置路径前:
import my from "../views/my/My.vue";
配置路径后(不用再担心文件层级关系):
import my from "views/my/My.vue";
注意,引用别名时如果是HTML中的路径,则需要在别名前面加符号~
<img src="~assets/img/tabbar/home.svg" alt="" slot="item-icon">
图片路径的引用问题:
1、循环遍历本地图片,渲染不出来。
解决办法:require加载,require加载图片时可以使用相对地址。
2、动态拼接地址,使用本地的图片不显示
<img :src="require(‘assets/images/logo‘+num+‘.png‘)" alt="">
总结:动态添加的src被当做静态资源处理了,没有进行编译,所以要加上require。
文件路径的引用问题(配置文件路径vue.config.js)
标签:不显示没有文件路径src模块codelogvueviews
以上就是文件路径的引用问题(配置文件路径vue.config.js)的内容,更多资讯请及时关注考必过网站,最新消息小编会第一时间发布,大家考试加油!