【发布时间】：2018-02-16 23:40:58
【问题描述】：
我正在寻找一种让 PhpStorm 监视文件的方法——这样每次它发生变化时，它都应该将该文件同步到远程服务器。而“上传外部更改”选项（带有“在显式保存操作时”）对我不工作。它很接近 - 但没有雪茄。它让我保存了两次 css 文件 - 只有在我第二次保存 scss 文件之后，它才会上传 gulp-compiled-style.css 文件，就像我希望在第一次“保存”之后那样.我知道这是一件小事——但对于我每天轻松完成 200-400 次的事情，我希望它尽可能顺利地运行。这既是我两次保存文件的时间 - 但它也是我心中的疑问，每次事情不像我想要的那样 - 然后我总是必须先检查文件是否正确上传。
我正在使用 Wordpress，我有 5-8 个 SCSS 文件，这些文件正在使用 gulp 进行编译。 gulp-procedures 非常全面（autoprefixer、merge-media-queries、minifycss 等），因此编译文件需要几毫秒。我认为正是编译时间使 PhpStorm “错过” style.css 已更改 - 因此不要在第一次“保存”时上传它。因为有时所有内容都会在第一次“保存”之后上传 - 但它只是每 8 次（左右）。
额外有趣的事实（可能表明尸体埋在哪里）：如果我在后台从终端运行gulp watch，那么我必须保存文件，等待至少 2-4 秒然后保存再次，在上传 gulp-compiled-style.css 文件之前。如果我按“保存”、“保存”、“保存”、“保存”- 少于 2-4 秒的暂停，但只有 1 秒的暂停，那么 PhpStorm 永远不会同步 gulp-compiled-style.css-file .
如果我从 PhpStorm 的 Gulp-integration（不是终端，而是 Gulp-prompt）运行gulp watch，那么我可以连续保存两次，中间只有 0.5 秒的停顿（只要底部的进度条消失） - 然后它上传（每次， - 一致）。
只有上传 gulp-compiled-style.css-file 才是问题所在。其他一切都运行良好。
这是我尝试过的：
**Attempt1) 我以前使用过 Atom，其中 FTP 配置是使用带有 .ftpconfig 文件的插件建立的。在那个文件中，有一个'watch: []'-参数，我可以在其中指定一个要“监视”的文件。这创造了奇迹！我试图找到一个可以做类似事情的插件 - 但找不到它。
**Attempt2) 我读过support-pages 中的一篇，也与此有关。似乎如果 SCSS 文件是使用 PhpStorm 编译的，那么它知道上传 style.css 文件（在编译之后）。我无法使用 PhpStorms 的 SCSS 编译来设置我的 gulp 文件（因为它会编译它，然后通过多个过程管道传输内容。如果我更改项目并且每次都必须设置它，那么这将是一个痛苦维护。
**Attempt3) 我想过做一个宏什么的。然后看看我是否可以将CMD-s 重新映射到'save-current-file-and-execute-the-macro'。但是，如果我不编辑 scss 文件（而只是一些 php 文件），那么它仍然会上传 style.css 文件。这绝不是一个漂亮的解决方案，但它只是显示了我在寻找自动化解决方案的过程中走了多远。
**Attempt4) 我考虑将它构建到 gulp 文件中，它必须在编译完 style.css 文件后上传 style.css 文件。我考虑从.idea-文件夹中获取主机和用户名-并从钥匙串中获取密码，然后以这种方式建立 sftp 连接。但是这样做很快变得广泛，所以我希望有一种更简单/更好的方法。
加法1
LazyOne 询问，我用文件观察器尝试了什么，所以这里。我尝试让 PhpStorm 编译 Scss 文件（所以 PhpStorm 基本上做了 Gulp 今天为我做的事情）。 所以这是一个 SCSS-filewatcher（文件类型），范围是我项目中的 SCSS 文件，将“程序”指向我的 ruby 安装的 scss 文件等，等等。
但是...我意识到让 PhpStorm 对 Scss 文件执行与 Gulp 文件相同的操作是很困难的。
我使用的 Gulp 文件随每个项目一起提供（默认情况下）——我们是几个从事相同项目的网页设计师。因此，如果我突然使用该 Gulp 文件执行其他操作，那么我很确定我必须能够产生完全相同的结果，否则我很确定我的同事会活活剥我的皮。但是在我放弃之前，我尽可能地把它作为我的论点（在它完成我的 Gulp 文件所做的之前，我仍然需要在这一行中做几件事）：
--no-cache --update $FileName$:../../style.css --style compressed --sourcemap=none
...但是...当这样做时，我可以得出结论，style.css-file 已在每次保存时上传（得分！）。这意味着如果我可以设置某种文件观察器，那么希望 PhpStorm 会观察该文件并因此在 Gulp 编译完 style.css 后上传它。
所以我尝试制作一个文件观察器，它可以观察 style.css 文件——但我不知道该放什么作为我的“程序”。因为基本上我希望 PhpStorm 用一根棍子戳 style.css 文件三次 - 然后意识到文件已经更改并将其上传到服务器。这可以自动完成吗？
【问题讨论】：
-
如果您在 IDE 之外编译您的东西（
gulp watch等）......那么我能提供的最好的方法是 1）尝试将其实际实现为 File Watcher。如果您已经尝试过 - 显示您尝试过的内容。如果您在该论坛主题中查看我的 cmets - 它应该可以工作 2) 手动点击File | Synchronize（此操作会检查所有本地项目文件，以查找在 IDE 之外进行的可能更改）。一旦找到此类更改，“上传外部更改”应跳转。 -
嗯 ... 1) 您可以让多个文件观察程序处理同一个文件（将一个接一个地运行），或者您只是对它们进行批处理（通过自定义中间脚本 .. 或 gulp 任务）2 ）您可以创建专用的 gulp 任务来执行此类编译/任何操作（因此您将所有逻辑保留在内部）并在 File Watcher 中调用它。在这两种情况下（正如我在该论坛帖子中所述），关键是将
Path to refresh字段指向目标生成的文件——这是 IDE 将在文件观察程序完成后检查更改的文件。 -
两者都没有。在＃1中，我的意思是-如果您需要在一个/同一个文件上运行几个不同的东西（例如，首先“scss into css”；然后是“prefixer”；然后是“minification”），那么您可以设置 3 个文件监视程序，它们将一个接一个地跑。但这并不理想。
-
因此我建议 #2 .. 我的意思是 -- 执行专门的 gulp 任务作为文件观察器。这意味着：创建单独的 gulp 任务（或您已经完成的任何任务）来执行此类“编译此文件”工作。然后——在 File Watcher 中使用它——从那里执行那个 gulp 任务。程序——你的 gulp 可执行文件的路径； params -- 在命令行中执行这个 gulp 任务所需的任何参数。
-
老实说——我没有任何工作示例（我自己没有使用过这个——我只使用“基本”文件观察程序——使用@编译 SCSS/LESS 987654334@ 或
lessc-- 这对于我在这里所做的事情已经足够了。但我会尝试找到一个。同时 -- 你是否尝试过在 PhpStorm blog.jetbrains.com/webstorm/2014/11/gulp-in-webstorm-9 中集成 Gulp（它有专门的工具窗口）？如果你从那里运行这样的“gulp watch”任务，它应该会接收到这样的文件修改（见youtrack.jetbrains.com/issue/WEB-14873或youtrack.jetbrains.com/issue/WI-28567）
标签： intellij-idea gulp phpstorm