微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

在 vscode 中保存时自动应用更改

如何解决在 vscode 中保存时自动应用更改

我已将 vscode 安装到两台不同的 PC 中,其中一台自动应用我在我正在工作的 .vue 文件模板中所做的更改,而在其他单元中没有这样做(eg 当我将按钮的高度从 1rem 更改为 5rem 时,我将能够看到 Google 或 Mozilla Firefox 浏览器中的更改立即应用或页面重新加载自动而无需我对其进行任何操作)。当我对资产文件夹中的外部 CSS 文件进行更改时也是如此。

我也尝试并安装了相同的扩展(例如 live-server、live-Sass-compiler、vetur、prettier),但同样的问题在另一台 PC 上仍然存在。现在,我无法使用自动应用更改模板或 CSS 来访问 PC。所以我的问题是:有没有人知道如何启用或恢复当您将 vscode 中的更改保存到浏览器时自动应用更改的功能

我做过的其他故障排除:

  1. 从系统中完全卸载并重新安装了 vscode。
  2. 删除项目的本地文件夹,再次克隆它们,然后重新安装包。
  3. 删除所有扩展并重新安装。

附言我在处理同一个项目时使用 nuxt.js 框架。

解决方法

该问题可能来自未运行的本地 VScode 服务或某些未镜像到另一个服务的设置。

您可以比较 VScode 设置的 2 个实例,为此:ctrl + shift + p(又名命令面板)并输入 Preferences: Open Settings (JSON)
相关设置可能与 "editor.formatOnSave": true 有关,或者您没有运行 ESlint 服务器?

通常,Nuxt(更准确地说是 Webpack 本身)只会监视项目中的文件,如果您编辑这些文件,它将 HMR(热模块重新加载)页面。
如果更改也与 SSR 相关,则会刷新页面。

您可以使用此扩展程序:https://marketplace.visualstudio.com/items?itemName=Shan.code-settings-sync
它将允许在编辑器之间同步设置。因此,将它安装在“工作”VScode 上,上传它的设置并在“非工作”VScode 上下载这些设置。

最后一件事,您还可以尝试创建一个新的 Nuxt 项目,以查看它是否 HMR/自动重新加载,也可能来自该项目(如果出现问题)。最重要的是重新加载可能会更快!

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。