VSCode保存.vue文件时脚本内容被覆盖为[object Promise]的解决方法

这个问题大概率是Vue文件的格式化/代码处理插件在执行时返回了Promise对象而非实际代码，导致保存时被错误替换。试试以下方案：

• 排查可疑插件
  禁用所有Vue相关的格式化插件（比如Vetur、Prettier、ESLint），然后逐个重新启用，每次保存.vue文件测试，定位到出问题的插件后，要么更新插件到最新版，要么替换为替代工具。

• 检查VSCode格式化配置
  打开设置（快捷键Ctrl+,），搜索format on save，确保Vue文件的默认格式化工具配置正确。手动打开settings.json，确认以下配置无冲突：

  "editor.formatOnSave": true,
  "[vue]": {
    "editor.defaultFormatter": "vue.volar"
  }
  

  若之前用的是Vetur，可替换为官方推荐的Volar插件，兼容性更稳定。

• 清理VSCode缓存
  关闭VSCode，删除对应路径的缓存文件夹：

  • Windows：%APPDATA%\Code\Cache 和 %APPDATA%\Code\CachedData
  • macOS：~/Library/Application Support/Code/Cache 和 ~/Library/Application Support/Code/CachedData
  • Linux：~/.config/Code/Cache 和 ~/.config/Code/CachedData
    重新启动VSCode后测试。

• 检查项目配置文件
  项目根目录的.eslintrc、.prettierrc等配置如果有语法错误，可能导致格式化逻辑异常。暂时禁用ESLint自动修复功能（在settings.json中设置"editor.codeActionsOnSave": {"source.fixAll.eslint": false}），测试是否还会出现问题。

内容的提问来源于stack exchange，提问作者lsuperx