【问题已解决】Vue管理后台,点击登录按钮,会发起两次网络请求(竟然是vscode Compile Hero编译插件导致的)

问题

Vue+Element UI 做的管理后台,点击登录按钮,发现 接口会连续掉两次发起两次网络请求,但其他接口都是正常调用的,没有这个问题,并且登录按钮也加了loading,防止重复点击,于是开始进行排查

排查

request文件以及 接口封装都排查了 没有发现问题,最后通过打断点,一步一步调试,发现是因为 this.$store.dispatch("Login", user),是dispatch触发了两次方法,发起了两次网络请求

找到问题了,想换一种方法来写登录这块的逻辑,但是代码改动比较大,而且治标不治本,

思考

这种写法本身没有什么问题,那么为什么会触发两次呐?

最后发现竟然是vs code中的下载了插件导致的

bash 复制代码
Vs code中Sass/Less/Stylus/Pug/Jade/Typescript/Javascript Compile Hero Pro插件

在VSCode安装了这个插件后,会有这个问题,保存后会在我本地文件store里,生成dist文件夹,里面有同名的文件(名字.devjs),所以每次执行actions都运行两次

解决办法

果断选择卸载该插件,

小小记录一下~ 实在是没想过这方面会影响,一直以为是代码写的有问题,排查了一下午的时间

Tips

如果发现 卸载了插件,页面有报错,

报错信息为"Module build failed (from ./node_modules/sass-loader/dist/cjs.js)"错误

清理缓存 有时缓存问题可能导致编译错误。尝试清理缓存并重新构建项目

在终端输入

npm cache clean --force

npm install

即可解决该问题~ (我遇到了哈~小小记录一下)

相关推荐
打小就很皮...13 小时前
React 合同审查组件:按合同标题定位
前端·react.js·markdown
v_for_van13 小时前
STM32低频函数信号发生器(四通道纯软件生成)
驱动开发·vscode·stm32·单片机·嵌入式硬件·mcu·硬件工程
CHU72903513 小时前
智慧陪伴新选择:陪诊陪护预约小程序的暖心功能解析
java·前端·小程序·php
奔跑的web.13 小时前
TypeScript namespace 详解:语法用法与使用建议
开发语言·前端·javascript·vue.js·typescript
倾国倾城的反派修仙者13 小时前
鸿蒙开发——使用弹窗授权保存媒体库资源
开发语言·前端·华为·harmonyos
泰勒疯狂展开14 小时前
Vue3研学-组件的生命周期
开发语言·前端·vue
Charlie_lll14 小时前
学习Three.js–基于GeoJSON绘制2D矢量地图
前端·three.js
计算机学姐14 小时前
基于SpringBoot的自习室座位预定系统【预约选座+日期时间段+协同过滤推荐算法+数据可视化统计】
java·vue.js·spring boot·后端·spring·信息可视化·tomcat
小二·14 小时前
Python Web 开发进阶实战:AI 原生安全防护 —— 在 Flask + Suricata 中构建智能网络威胁狩猎平台
前端·人工智能·python
葡萄城技术团队14 小时前
SpreadJS V19.0 新特性解密:设计器容器行列合计,让报表数据汇总更灵活
前端