VUE项目常见的技巧总计
- 作者: 妈妈说名字长躲在树后面不会被部落发现
- 来源: 51数据库
- 2021-09-02
1、修改绝对路径为相对路径
打开config/index.js,在build中添写如下代码：
assetsRoot: path.resolve(__dirname, '../dist'),
assetsSubDirectory: './static',
assetsPublicPath: './',
2. 解决跨域问题(使用代理proxy)
打开config/index.js,在proxyTable中添写如下代码：
'/api': { //使用"/api"来代替"http://f.apiplus.c"
target: 'http://192.168.1.247:51001', //源地址
changeOrigin: true, //改变源
pathRewrite: {
'^/api': '' //路径重写
}
}
3.CSS背景图不显示问题
（本地开发调试没问题，发布后，CSS背景图不显示。）
打开build下的utils.js文件，添加代码：
// Extract CSS when that option is specified
// (which is the case during production build)
if (options.extract) {
return ExtractTextPlugin.extract({
use: loaders,
fallback: 'vue-style-loader',
publicPath:'../../' //20201110，解决CSS背景图片问题
})
} else {
return ['vue-style-loader'].concat(loaders)
}
4. vue项目IE中访问为空白页面
（原因是使用VUEX），解决：
1）cnpm install --save babel-polyfill
2）在build》webpack.base.conf.js文件中，添加’babel-polyfill’: ‘babel-polyfill’,
entry: {
// 在IE中使用VUEX
'babel-polyfill': 'babel-polyfill',
app: './src/main.js'
}
推荐阅读
