How do you automatically change your JS and CSS on OS X or Webstorm?

Question

I use two different IDEs based on what I do. My primary IDE is Visual Studio, in which I use Chirpy to crush and shrink my code. It works flawlessly and I like it. The problem is that when I am not in my Windows window, I do not have access to it.

When I do not use Visual Studio, I usually write Javascript applications in Webstorm on my Macbook Pro. Here lies the problem. I did not find the Webstorm plugin or any other application that I can configure to view my scripts, as well as mash / minify.

How do you Mac users overwrite / minimize JS and CSS with minimal effort during development?

Answer 1

For those who are now upgraded to WebStorm 6, this functionality is built-in. Just go to “File” (or something else equivalent to Mac) → “Settings” → “File Watchers” and define the file watcher for the type of file you need to watch.

The relevant help documentation is here - http://www.jetbrains.com/webstorm/webhelp/using-file-watchers.html

Answer 2

I use lessc and uglifyjs to concatenate and minimize my css and js files. Here's the makefile from Twitter Bootstrap in which I used a modified version:

https://github.com/twitter/bootstrap/blob/master/Makefile

This is simple, since all I do is type make on the command line whenever I want to compile.

Answer 3

You can use the YUI compressor without a command line with these small applications:

• http://www.webmaster-source.com/minimus/ - free
• http://www.matmartinez.net/delivery/ - free

Answer 4

I am not a Mac and Webstorm user, but this may be relevant.

For javascript, I use the closure compiler as part of the loading script to minimize it. It does not control the files, it starts when I start the download (bash file).

If you want to keep all this in an IDE, it looks like Webstorm has an Ant plugin http://plugins.intellij.net/plugin/?webide&id=4526 that you could use to execute the close compiler.

If you can find the css minifier command line, then you can put it in an Ant script.

Answer 5

I am using Minify . It is located in the Mac App Store .

I designed it to support my own workflow. minifyapp.com