解决保存文件卡顿 - VSCode禁用保存时触发的插件

陌雪姑娘_5670

陌雪姑娘_5670

2026-08-31

157人浏览

原创

vscode保存卡顿真凶常是onsave插件,如prettier、eslint、gitlens等在onsave事件中同步执行重操作导致主线程阻塞;应禁用高危插件、关闭自动触发、配置files.watcherexclude及大文件纯文本模式。

解决保存文件卡顿 - vscode禁用保存时触发的插件

保存卡顿真凶常是 onSave 插件

VSCode 保存时卡顿,八成不是文件大或机器差,而是某个插件在 onSave 事件里同步执行了重操作——比如 Prettier 全文档格式化、ESLint 全量校验、或者 GitLens 自动提交前检查。这些动作默认阻塞主线程,用户会明显感到“光标停住、界面冻结、进度条转圈”。

  • 不是所有“启用中”的插件都会参与保存流程,只看它是否声明了 "activationEvents": ["onSave"] 或类似触发条件(可在插件 package.json 里查,但更简单的是看行为)
  • 典型高危插件:esbenp.prettier-vscode、dbaeumer.vscode-eslint、gitlens、bradlc.vscode-tailwindcss(尤其开启 tailwindCSS.experimental.classRegex 时)
  • 禁用方式必须选对作用域:右键插件 → Disable (Workspace),避免影响其他项目;若确定长期不用,选 Disable (For All Folders)
  • 禁用后无需重启窗口,但需关闭并重新打开当前文件(或切换到其他标签再切回),否则旧监听器可能仍驻留

如何确认哪个插件在 onSave 时拖后腿

别靠猜。打开命令面板(Ctrl+Shift+P / Cmd+Shift+P),运行 Developer: Show Running Extensions,重点看两列:

  • Status 列显示 Running 且 CPU 列在你按 Ctrl+S 后突然跳高(>100MB 波动)的插件,基本就是它
  • Activation Time 超过 500ms 的插件,大概率在保存瞬间被拉起——尤其是语言服务器类(如 ms-python.python)或格式化类(如 esbenp.prettier-vscode)
  • 若看到 Extension host terminated unexpectedly 报错紧随保存操作出现,说明该插件的 onSave 处理逻辑崩溃了,但没退出进程,持续占用资源

比禁用更稳的方案:关掉 onSave 自动触发

很多插件支持配置“不自动在保存时运行”,既保留功能,又避开卡点。改项目根目录下的 .vscode/settings.json 即可:

VSCode
VSCode

避免常见的 VSCode 错误——设置冲突、调试器配置和扩展冲突。

下载
  • 对 prettier:加 "prettier.requireConfig": true + 在项目根加 .prettierrc,否则它默认全文件格式化;再加 "editor.formatOnSave": false(用快捷键 Shift+Alt+F 手动触发)
  • 对 eslint:设 "eslint.run": "onSave" → 改为 "onType" 或干脆 "never",配合 "eslint.enable": true 保留手动扫描能力
  • 对 gitlens:关掉 "gitlens.advanced.messages": true 和 "gitlens.codeLens.enabled": false,它们常在保存时触发 Git 状态查询
  • 所有修改后,必须关闭当前工作区窗口,再用 code . 重新打开,设置才真正生效

大文件保存卡顿?先绕过语言服务器

当你编辑 bundle.js、vendor.css 或日志文件时,typescript-language-server 或 python-language-server 会试图构建 AST,直接卡死。这不是插件问题,而是 VSCode 默认把所有文件都交给语言服务处理。

  • 在 .vscode/settings.json 中加:"files.associations": {"bundle.js": "plaintext", "vendor.css": "plaintext"},让它们以纯文本模式打开,跳过语法解析
  • 对 TypeScript 项目,加:"typescript.preferences.includePackageJsonAutoImports": "auto",避免加载全量 @types
  • 设 "typescript.tsserver.maxTsServerMemory": 8192,防止 TSServer 内存爆掉后反复重启
  • 最关键一步:确保 files.watcherExclude 已配好(含 "**/node_modules/**" 等),否则即使关了 onSave,插件仍会因文件变更事件被反复唤醒

真正难处理的不是某个插件报错,而是它悄悄注册了 onSave 监听却没做防抖或超时控制——比如一个图标插件,本不该参与保存,却因监听了 onFileSystem 事件,在写入瞬间被拉起并同步读取整个 node_modules。这类问题不会出现在控制台报错里,只能靠 Developer: Show Running Extensions 的 CPU 列和手动开关验证来揪出来。

相关文章

PHP速学视频免费教程(入门到精通)
PHP速学视频免费教程(入门到精通)

PHP怎么学习?PHP怎么入门?PHP在哪学?PHP怎么学才快?不用担心,这里为大家提供了PHP速学教程(入门到精通),有需要的小伙伴保存下载就能学习啦!

下载

相关标签:

vscode插件禁用 vscode

本站声明:本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn

相关专题

更多
vscode是什么_vscode怎么安装配置
vscode是什么_vscode怎么安装配置

VS Code(Visual Studio Code)是一款免费、开源的跨平台代码编辑器,由微软开发和维护。它被广泛用于软件开发和编程,支持多种编程语言和框架。VS Code 同时提供了丰富的功能和扩展性,使开发者可以高效地编写、编辑和调试代码。

2023.06.30

1395

18

vscode怎么运行代码
vscode怎么运行代码

vscode是一个运行于MacOS X、Windows和Linux之上的,针对于编写现代Web和云应用的跨平台源代码编辑器;vscode免费而且功能强大,对JavaScript和NodeJS的支持非常好,自带很多功能,例如代码格式化,代码智能提示补全、Emmet插件等。php中文网给大家带来了相关的教程以及文章,欢迎大家前来阅读学习。

2023.07.21

2952

3

vscode使用的框架介绍
vscode使用的框架介绍

VSCode是一款跨平台代码编辑器,它基于Electron框架和Monaco Editor构建。想了解更多vscode的相关内容,可以阅读本专题下面的文章。

2024.03.14

1989

12

vscode一般用来写什么语言
vscode一般用来写什么语言

VSCode是一款功能强大的代码编辑器,支持多种编程语言和文件格式。它内置对 JavaScript、Python、Java、C++、TypeScript、HTML/CSS、Go 等语言的支持。想了解更多vscode的相关内容,可以阅读本专题下面的文章。

2024.03.14

1727

8

vscode可以写什么语言
vscode可以写什么语言

vscode是一款强大的代码编辑器,支持多种编程语言的开发。通过安装扩展,可以为 JavaScript/TypeScript、Python、Java、C#、PHP、Go、Ruby、Rust、HTML/CSS 等语言提供智能代码补全、调试和格式化等功能。想了解更多vscode的相关内容,可以阅读本专题下面的文章。

2024.03.15

2607

12

vscode中文设置方法
vscode中文设置方法

方法一:在设置页面中,搜索“locale”,并选择“zh-cn”。方法二:按“Ctrl Shift P”快捷键,输入“Configure Display Language”,将语言修改为“zh-cn”。如果上述方法无效,可考虑安装中文插件。想了解更多vscode的相关内容,可以阅读本专题下面的文章。

2024.03.15

1838

14

vscode用途介绍
vscode用途介绍

Visual Studio Code(VSCode)是一款由 Microsoft 开发的多功能文本编辑器,适用于各种编程语言。作为一款开源软件,VSCode 拥有代码高亮、自动补全、调试、Git 集成等强大功能,成为程序员不可或缺的工具。想了解更多vscode的相关内容,可以阅读本专题下面的文章。

2024.03.15

1262

10

vscode和visualstudio的区别
vscode和visualstudio的区别

Visual Studio是一款功能强大的集成开发环境(IDE),适用于专业开发人员进行复杂项目的构建。而VSCode则是一款轻量级的代码编辑器,更适合各种规模的项目开发。想了解更多vscode的相关内容,可以阅读本专题下面的文章。

2024.03.15

1116

8

vscode设置中文界面不生效解决方法
vscode设置中文界面不生效解决方法

vscode设置中文界面不生效解决方法:安装中文语言包、通过命令面板设置语言、检查 locale.json 设置、重新安装中文语言包、检查 VSCode 版本和更新、排除插件冲突、检查系统语言设置、查看 VSCode 日志和错误消息、重置 VSCode 设置、查看官方文档和社区支持。想了解更多vscode的相关内容,可以阅读本专题下面的文章。

2024.03.15

494

5

热门下载

更多
网站特效
/
网站源码
/
网站素材
/
前端模板

精品课程

更多
相关推荐
/
热门推荐
/
最新课程