Vue项目中遇到的问题汇总
一、打包后的打开index.html页面空白的几种情况:
- 引入的css、js路径报错,此时解决方法:把vue.config.js中的增加publicPath: ‘./’ 或者把原来的baseUrl改为publicPath,在vue-cli3.3以上废弃了baseUrl,更改为publicPath.
- router.js中的mode,如果为history模式的话需要服务器配置(该模式去掉链接的#);也可以把history换成mode模式(即为默认),此时的链接是带有#的(可以参考链接:https://router.vuejs.org/zh/guide/essentials/history-mode.html)
- 浏览器不支持vue,需要把es6、es7语法转换为es5语法。(安装babel-polyfill,在main.js中引入babel-polyfill:import 'babel-polyfill')
二、在项目中的this指向问题:
setTimeout(() => { console.log(this); // 此时的this指向window }, 500);
解决方法:
//使用变量访问this实例 let self=this; setTimeout(function () { console.log(self); // 使用self变量访问this实例 },1000);
三、vue中的跨域(设置代理)
在vue.config.js中
module.exports = { devServer: { open: true, host: '0.0.0.0', port: 8808, proxy: { '/api': { target: '', //对应自己的接口 changeOrigin: true, ws: false, pathRewrite: { '^/api': '' } } } } };
希望大佬看到有不对的地方,提出博主予以改正!