Sorry in advance if I'm posting in to the wrong stack. I'm new to PhpStorm (coming from NetBeans) and I'm struggling to configure a File Watcher to compile my Sass files to the correct location.
The file I need compiling is located in
/sass/admin/styles/output/default.sass
I need it to compile the CSS to
/web/css/admin/styles/output/default.css
My arguments path for the watcher is
--no-cache --update $FileName$:$ContentRoot$/web/css/$FileRelativeDir$/$FileNameWithoutExtension$.css
Which ends up compiling the file to
/web/css/sass/admin/styles/output/default.css
I need to remove the sass part from the $FileRelativeDir$ macro but I don't know if this is possible. Is it possible to achieve this kind of file structure?
Already answered here -
https://stackoverflow.com/a/15965088/1389760
I changed my argument path to
--no-cache --update $FileName$:$ContentRoot$/web/css/$FileDirPathFromParent(scss)$/$FileNameWithoutExtension$.css
Changing the macro allowed me to set a parameter that removed the 'SCSS' from the directory path, and it now compiles to the desired location.
Related
I'm using phpstorm and I want to use the file watcher plugin with SASS. But I can't find the SASS executable file. It isn't in the path where it should be(I think):
C:\Ruby21-x64\lib\ruby\gems\2.1.0\gems\sass-3.4.21\bin.
There are 3 files but without an file extension.
I already reinstalled SASS a few times but it doesnt help. Does anybody know where the executable file could be? Thanks in advance
You must specified path for sass.bat or scss.bat files locate in :
C:\Ruby21-x64\bin\sass.bat
or
C:\Ruby21-x64\bin\scss.bat
You can read this for more information for PHPStorm Settings : PHPStorm File Watchers
I just installed Sass using Ruby Gems, although my project is in NodeJS in Webstorm. To enable the SASS file watcher in Webstorm. When I run "sass styles.scss" from the commandline, I get a .sass-cache folder but not the actual compiled CSS file. Webstorm does not show any errors in my SASS file. I need the file to compile to a .css file.
I am also trying to setup a filewatcher in Webstorm that is not compiling the scss file. My SCSS executable path in the filewatcher in Webstorm is this. C:\Ruby200-x64\bin\sass.bat.
Here are the filewatcher settings.
The error Webstorm shows in the console, when the .scss file is saved is (which is when the file watcher should be triggered), is this:
C:/Ruby200-x64/bin/sass.bat --no-cache --update styles.scss:styles.css
'"ruby.exe"' is not recognized as an internal or external command,
operable program or batch file.
The full argument to the file watcher that cant be entirely seen in the image above is this:
--no-cache --update $FileName$:$FileNameWithoutExtension$.css
Here it is:
Didn't numerate but from top to bottom,
Select you watcher, you can make presets for various situations (Maybe try to make a new one)
Path to my 32bit sass.bat (not 100% sure but I think that even scss.bat worked)
Output, you can see in screenshot below how it should work/look.
I have configured a PyCharm file watcher that transpiles SCSS (in a SCSS folder) into CSS (in a CSS folder). The CSS files appear to reflect the changes in the SCSS files only when I close and re-open the CSS folder dropdown. How can I make this process automated?
This is what I have in the arguments field:
--no-cache --update $FileName$:$ProjectFileDir$/main/static/css/$FileNameWithoutExtension$.css
The Output paths to refresh option is the directory that gets refreshed. It needs to match the output directory you specified in the arguments field $ProjectFileDir$/main/static/css/
For future reference: I've published a post here on how to configure the file watcher with SCSS.
http://codeveloped.blogspot.nl/2015/01/pycharm-filewatcher-and-sass-scss.html
console: gem install sass
console: gem install scss
console: gem install compass
console: which scss <--get the path
Pycharm: "Programm" set: path from 4. it could be /usr/local/bin/scss or usr/bin/scss
Pycharm: "Arguments" set: --no-cache --update --force --sourcemap=none --compass $FileName$:$ProjectFileDir$/app-name/static/css/$FileNameWithoutExtension$.css ( be carefull using $Sourcepath variable as mentioned before, it can return depending on the project multiple path path1:path2:path3 and scss do nothing)
Pycharm: "Output paths to refresh" set: $ProjectFileDir$/app-name/static/css/
I'm pretty new to SASS/SCSS and got a git project with CSS Files in the main directory which shall import partials from a subdirectory. I was wondering if it's possible to install sass on the server, create a compass project so that css files will be created automatically after a live edit of the scss files on the server? Or does it have to be local with a filewatcher? I already tried to set up a compass project on the server but no css files were created automatically. Was it because of wrong settings or is it just not possible this way?
If it's possible is there a good step by step tutorial? I already found this
Maybe the problem is the path. In my config.rb I changed the path without knowing what to write in the string if sass and css directory are the same as project path. Didn't work with "/" or an empty string.
Both Sass and Compass provide watch commands. You can use either:
sass --watch input.scss:output.css (options)
or, assuming you've got your Compass config file correctly setting your css_dir vairable:
compass watch
Either of those should recompile the css file upon changes. If you want this done live on the server, you'll need to execute the watch command on the server.
To add a point to #aerook's answer,
In your projects you may have multiple scss and css files. In which case you may use the following to watch the entire scss directory to make changes in the css directory
sass --watch scss:css
PS : scss and css are folder names in the same directory path.
I'm using compass 0.10.4
I'm running a compass command and I want it to put it's output to the
server when I run a watch instead of to the project directory.
Is there any way of specifying an absolute path instead of a path
relative to the directory you want the css output to?
I'm trying to have my compiled css output to the directory:
/home/leeand00/leeand00.com/wp-content/themes/coffeeSunrise
but instead it is being output to
<compass-project-dir>/home/leeand00/leeand00.com/wp-content/themes/
coffeeSunrise
I've tried specifying the compiled css output directory using --css-
dir on the command line.
I've also tried changing the value of css_dir to
/home/leeand00/leeand00.com/wp-content/wp-content/themes/coffeeSunrise
in config.rb and
not specifying the --css-dir argument and I get the same result.
I realize that this can be specified using ../../../ (as many times as
needed) but since I don't always know where my deployment point would
be this is sub optimal.
Chris added this functionality to the latest build, but until the new version is released, you have to compile it yourself.
Just a tip:
For windows os you can add below
css_path="C:/ui/myproject/css"