I have a main.less file that contains @import for a number of .less files that I compile into 1 main.css file.
My main.less file:
@import "imports/header";
@import "imports/content";
@import "imports/footer";
......
In phpstorm 10 I set up a file watcher to compile main.less into main.css. My deployment options are to upload changed files on explicit saves (command S)
On save, the main.less file gets compiled properly if I made a change to any .less file. Then all .less files that I made changes to get uploaded to the server. However, main.css does not. I have to manually right click it and upload to server.
I believe this is because phstorm looks for changes before the less is compiled, then compiles less and does not notice the changed main.css
My folder structure for my less is:
/stylesheets/
____/imports/
________/header.less
________/content.less
________/footer.less
________/ .........
____/main.less
____/main.css
My less file watcher settings are:
Name: Less
Description: Compiles .less files into .css files
Uncheck Immediate file synchronization
Check Track only root files
File Type: Less
Scope: Project Files
Program: /usr/local/bin/lessc
Argument: main.less
Working directory: $FileParentDir$/stylesheets/
Environment variables:
i. Name: PATH
ii. Value:
/Applications/MAMP/bin/php/php5.4.30/bin:/Users/xxx/.composer/vendor/bin:/usr/bin:/bin:/usr/sbin:/sbin:/usr/local/bin
Output paths to refresh: $FileParentDir$/stylesheets/main.css
How do I make it so my main.css uploads after main.less has been compiled?
You need to configure your deployment settings.
Project Settings | Deployment | Options, setting the Upload changed files automatically to the default server option to Always And check option Upload external changes
Phpstorm will watch for changed scss and CSS files inside project directory and upload them.