关于javascript:在JetBrains WebStorm中使用node.js文件监视程序

Using a node.js file watcher with JetBrains WebStorm

我在项目中使用Prettier已有几周了。我真的很喜欢!

我使用JetBrains WebStorm IDE,所以我在Prettier项目站点上遵循了以下说明,以了解如何在WebStorm中设置文件监视程序:https://prettier.io/docs/en/webstorm.html#using-file -watcher

然后,每次我保存一个JavaScript文件时,Prettier都会自动在其上运行,并且一旦Prettier保存该文件,WebStorm就会向我显示更改。

我希望团队中的每个人都使用Prettier,但不是每个人都使用WebStorm。有些人使用的编辑器无法通过Prettier轻松配置。因此,我按照Prettier项目站点上的以下说明进行操作,以了解如何在我的package.json文件中将文件监视程序设置为npm脚本:https://prettier.io/docs/en/watching-files.html

1
2
3
"scripts": {
 "prettier-watch":"onchange '**/*.js' -- prettier --write {{changed}}"
}

按照文档中的建议,我使用onchange包作为文件监视程序,并且由于不需要Prettier连续运行两次而禁用了WebStorm中的文件监视程序。

问题是,当我在WebStorm中保存文件时,onchange程序包可以正确运行Prettier,但是即使退出并返回文件窗口,我也看不到编辑器中的更改。用我的鼠标光标。当我尝试进行新的更改并再次保存时,我从WebStorm收到此"文件缓存冲突"警告消息:"对内存和磁盘进行了更改。保留内存更改,显示差异,加载文件系统更改"

enter

似乎唯一的方法是改为使用WebStorm的内置文件监视程序,但是我没有一种简单的方法为我的同事设置Prettier,而又不强迫他们手动安装自己的独立解决方案。 >

所以我的问题是:如何使用通用的node.js文件监视程序作为npm脚本,该脚本在保存后对我的文件进行更改,并在没有此对话框的情况下自动将这些更改重新加载到WebStorm中?


我面临着同样的问题,毫无疑问,对话确实很烦人,而这些步骤最终帮助我解决了这个问题。

  • 转到Webstorm / Phpstorm设置/首选项
  • 打开文件监视程序的设置:/Tools/File Watchers/
  • 双击您的文件查看器,即Prettier
  • 这将打开一个用于编辑观察者的模式窗口。取消选中Auto-save edited files to trigger the watcher

据我了解,取消选中此选项将仅在手动保存文件时运行文件监视程序,并且将帮助您摆脱每次更改时该模式的过多外观。请不要忘记在这种情况下手动保存文件,以继续享受Prettier的乐趣。


也许您可以尝试在Webstorm的"系统设置"窗格中摆弄Use"safe write"设置。