Vue 安装配置axios 后页面一片空白

ゞ浴缸里的玫瑰 2023-02-27 05:58 25阅读 0赞

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NDY4NTg2OQ_size_16_color_FFFFFF_t_70]

造成 这个问题的原因有很多

##### 一、 #####

`javascript Uncaught TypeError: Cannot set property '$axios' of undefined`  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NDY4NTg2OQ_size_16_color_FFFFFF_t_70 1]  
报错信息说 $axios of undefined

我们打开 main.js 查看

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NDY4NTg2OQ_size_16_color_FFFFFF_t_70 2]  
将箭头所指处 改为小写。

##### 二 #####

`TypeError: setting getter-only property "$axios"`

vue-cli2 和 vue-cli3和4 安装方法还不一样，我使用的是 vue-cli4.3.1，应使用`npm add axios`，vue-cli2.0使用的是`npm install axios`

*  查看版本
    
        npm -V

main.js 配置如下更改

import axios from 'axios'
    Vue.prototype.$ajax = axios

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NDY4NTg2OQ_size_16_color_FFFFFF_t_70]: /images/20230209/c8c9198a40e343f3b5f8bc74c7f803ac.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NDY4NTg2OQ_size_16_color_FFFFFF_t_70 1]: /images/20230209/18356e2fbbb74247842302dadd6bdf09.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NDY4NTg2OQ_size_16_color_FFFFFF_t_70 2]: /images/20230209/3c89e2ddfc9842fbb4a6f6b15bd7389c.png

发表评论取消回复

表情：

评论列表（有 0 条评论，25人围观）

还没有评论，来说两句吧...

相关阅读

相关 Vue脚手架配置代理、安装axios

目录准备阶段准备学生服务器准备汽车服务器编辑安装axios 一、Vue脚手架配置代理代理服务器 Vue脚手架配置代理（一次性可以配置多个） vue.

曾经终败给现在/ 2024年04月06日 09:18/ 0 赞/ 85 阅读

相关 vue安装 axios

Axios 是一个基于 promise 的 HTTP 库，可以用在浏览器和 node.js 中。话不多说，直接上步骤：安装： 1.执行下面命令 npm方式

迷南。/ 2023年07月24日 09:09/ 0 赞/ 26 阅读

相关 vue axios配置

import axios from 'axios' axios.defaults.headers = \{ 'api-version': 'V1' \} ax

矫情吗；*/ 2023年06月16日 13:57/ 0 赞/ 151 阅读

相关 Vue 安装配置axios 后页面一片空白

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ub

ゞ浴缸里的玫瑰/ 2023年02月27日 05:58/ 0 赞/ 26 阅读

相关 Vue项目打包时页面空白

修改config/index.js ![在这里插入图片描述][2021042814040156.png] `/` 改为 `./` ![在这里插入图片描述][wat

女爷i/ 2023年01月17日 08:55/ 0 赞/ 181 阅读

相关 mysql页面空白,mysql – 尝试插入后的空白页面

每当我尝试将数据插入我的数据库“用户”时,我总会得到一个空白页面.它没有给我任何错误,它不包括’mainmenu.php’,或者返回任何反馈.有人可以帮我吗？这是代码： in

￡神魔★判官ぃ/ 2023年01月16日 11:07/ 0 赞/ 167 阅读

相关解决vue3打包过后空白页面

解决vue3打包过后空白页面在项目根目录下，新建一个vue.config.js文件 module.exports = { // 基本路径

深碍√TFBOYSˉ_/ 2022年11月17日 05:18/ 0 赞/ 540 阅读

相关打包vue文件后页面空白，出现报错

报错如下： Refused to apply style from 'http://127.0.0.1:5500/css/chunk-43aa77e1.33bcbef

r囧r小猫/ 2022年11月15日 11:40/ 0 赞/ 766 阅读

相关 vue在ie中页面空白

vue在ie中页面空白（同时解决vue-baidu-map不显示问题）公司项目需求需要处理浏览器兼容性问题，谷歌，搜狗，360安全，360极速都没有问题，但在ie11中

曾经终败给现在/ 2022年11月15日 01:17/ 0 赞/ 236 阅读

相关 Vue2.0做的项目在IE11下面打开一片空白？

解决方式：安装 "babel-polyfill" 即可。命令：cnpm install --save-dev babel-polyfill //我用的是淘宝镜像，所以

谁践踏了优雅/ 2022年06月09日 11:49/ 0 赞/ 225 阅读