Stop PHPstorm File Watchers Running Recursively (With Autoprefixer)

Stop PhpStorm file watchers running recursively (with Autoprefixer)

You have to:

  • create custom scope (Settings | Scopes .. or by clicking on corresponding "..." button in File Watcher);
  • [optionally] include desired files (e.g. *.css) -- not really required as "File Type" field of File Watcher already covers it
  • exclude already modified files (*.min.css)

Now use that scope in your File Watcher instead of default "Project Files"

PHPStorm File Watchers SCSS to Prefixed and Compressed CSS File

Sass is already pretty good at compression. Just execute your Sass compilation with a --style flag liked compressed. Ex:

sass --watch [your files] --style compressed

If you must handle the prefixing through PHPStorm, you'll need to look into their build tool Phing: http://www.jetbrains.com/phpstorm/webhelp/phing-build-tool-window.html

However, Compass (http://compass-style.org/install/) (a Sass add-on) has a large ecosystem of add-ons, one of which is AutoPrefixer: https://github.com/ai/autoprefixer#compass - a post-processor which adds the vendor-specific prefixes to CSS.

PHPStorm - Run Filewatcher on existing files?

  1. Select such file(s)/folder(s) in Project View panel
  2. "Help | Find Action" (Ctrl + Shift + A), activate check box for better results
  3. Search for "run file w" (without quotes, obviously) and choose Run File Watchers entry

Alternatively:

  1. "Settings | Keymap"
  2. Find that Run File Watchers action (under "Plugins | File Watchers" branch)
  3. Assign some custom shortcut
  4. Select desired file(s)/folder(s) in Project View panel
  5. Use that shortcut from step 3

Alternatively:

  1. "Settings | Menus and Toolbars"
  2. "Project View Popup Menu" branch
  3. Find desired location and click on "Add After..." button
  4. Locate Run File Watchers action (it's under "Plugins | File Watcher" branch) and click on "OK" button
  5. The action is now accessible via content menu in Project View panel and can be used on desired files and folders.

Less File Watcher creates empty files in PhpStorm

Uncheck Create output file from stdout in Advanced Options of your File Watcher

PhpStorm: how to add watcher on 1 JS file only and not on ALL JS files?

Use Scope field to limit the watched files: create custom Scope that will include only desired file(s) and/or folders and use it there in File Watcher.

Scope can accept both "include" and "exclude" patterns at the same time so it's very flexible in filtering the files.


The same approach for your second issue -- use scope to not to process already processed files.

For example: https://stackoverflow.com/a/24938053/783119


The alternative to having 2 separate File Watchers is creating some batch/shell script that will do that minification + obfuscation and use it as a program in File Watcher.

Another option -- use build tools (Grunt/Gulp or alike) and call appropriate task there.

PhpStorm file watcher for individual files on remote hosts

remote file watchers are not supported, please follow WEB-9724 for updates

File Watcher Tool JetBrains IDE - CSSO Setup - Auto Minify CSS

As .min.css files are still CSS files, your watcher listens to changes in all them ( because watcher Scope == Project files, File type == CSS) and produces the output.

As a workaround I can suggest excluding minified files from watchers processing:

  • create a new scope (Settings | Appearance & Behavior | Scopes) with minified files excluded (like file:.css&&!file:*.min.css)
  • choose this scope as your file watcher Scope


Related Topics



Leave a reply



Submit