I wonder how can I solve to make my project output css file to compile in compressed format, cause there is not an option for that if i install compass to my project
The option should be on the right hand column, but there isnt. I also did choosen the output style: compressed in codekit preferences for sass/scss.
Note again I have problems with output compress only when compass is installed on my project.
P.S: anyone know a good snippet collection for sccs -> compass? for sublime text 2
Ohh i found out how to solve it, in config.rb file:
# Set this to the root of your project when deployed:
http_path = "/"
css_dir = "stylesheets"
sass_dir = "sass"
images_dir = "images"
javascripts_dir = "js"
fonts_dir = "fonts"
output_style = :nested
if i edit the output_style directly from there it will work just fine with compass, just make :compressed
anyways im still curious if there is a good snippet vocabulary for compass #includes (mixins)
Related
I tried to look around here and over the internet, searching for a solution but i can't find anything that works with my current env. Let me explain how it is, i have a standard Wordpress project and i'm writing SCSS in [n] different places:
/wp-content/themes/{my-child-theme}/scss which contains all of my _{file_name}.scss divided into [n] directories and a style.scss file inside the root of the theme that loads them all, so:
which should generate only one .css file: style.css. This is the first working dir.
All the others are custom plugins which i develop, so all the scss would be (i use the same folder struct for all my plugins) /wp-content/plugins/{my_plugin_name}/Resources/assets/css which contains a {my_plugin_name}.scss file that loads all the other scss part which are divided like in the screenshot above, so /pages and /parts + something else if that happens. I want for this .css to be generated in the same place as the {my_plugin_name}.scss is.
I was used to go with this config.rb file:
http_path = "/"
css_dir = "/"
sass_dir = "/"
images_dir = "/"
javascripts_dir = "/"
output_style = :compressed
And this file watcher conf:
If i keep it all that way, all of my .scss gets compiled, everywhere. That's obviously something i don't want. How should i configure this env (config.rb + file watcher) to make it work as i want?
I use PhpStorm 2019.3.4 on MacOs Catalina if that matters. Any help/suggestion would be appreciated. Thank you
Navigator of the future, this is what i came out with since no solution were given to me. Create a file watcher and user and use this lines as "arguments" parameter of the watcher config. Use scope "Project Files" and working dir "$ProjectFileDir$"
compile -c config_plugin.rb --debug-info --time --trace --force
compile -c config_theme.rb --debug-info --time --trace --force
where config_[what] is a separated file made like this:
http_path = "wp-content/plugins/plugin_name/"
css_dir = "wp-content/plugins/plugin_name/"
sass_dir = "wp-content/plugins/plugin_name/"
sass_dir = "wp-content/plugins/plugin_name/"
images_dir = "wp-content/plugins/plugin_name/"
javascripts_dir = "wp-content/plugins/plugin_name/"
output_style = :compressed
I am trying to set my css output file from the config.rb file to the root level of my main directory and to be named "style.css". The issue I am having is I when I set all of the filepaths in the config.rb like the following it all works fine.
http_path = "/"
css_dir = "assets/css"
sass_dir = "assets/sass"
images_dir = "assets/images"
javascripts_dir = "assets/js"
fonts_dir = "assets/fonts"
output_style = :compressed
environment = :development
But I develop a lot of WordPress websites locally and need to have the css_dir = "assets/css" be set to the root of the main directory and to be named style.css. if I try things likecss_dir = "/" it breaks and doesn't output my style.css to the root.
Any suggestions please as to how I may do this so I don't have to stick with the current way of moving my output from assets/css/style.css to the root level manually upon deployment, (this has been my previous solution). This would not be ground breaking in my efficiency or my workflow, but it seems so simple and that it should be an option, so I have to ask the community.
I also tried Chris Coyier's suggestion here and that didn't seem to work either http://css-tricks.com/compass-compiling-and-wordpress-themes/
Maybe this will help:
When setting your http_path in config.rb, you are telling Compass what the path to the current directory is. It's only really used if you have absolute paths turned on and are using Compass URL helpers. Compass doesn't know what your "real" project root is (when it comes to PHP CMSes like WordPress or Drupal, for example).
Let's take the following document structure:
project_root
- foo
-- bar
--- baz
baz is going to be our theme folder.
Now when it comes to compiling your CSS, I'm not entirely sure what you're asking, whether it's that you want to change the CSS Directory for your production build only and keep it at assets/css for your development, or just change the directory. Either way, I've got you covered. For both of these, we're going to assume that the outside of Compass root directory we want the CSS generated in is project_root
Change CSS Directory Path for Production Build Only
Set css_dir = (environment == :development) ? 'assets/css' : '../../../' to compile your CSS into assets/css during development builds (compass compile/compass watch) and into project_root during production builds (compass compile -e production --force). The key here is that we're using Unix style directory changing to place the file outside of our theme directory.
Change CSS Directory Path for All Compiling
Set css_dir = "../../../" and simply runcompass watch/compass compile` as normal.
Either way, don't have Compass rewrite your file name. Name your Sass file style.scss
Having a strange problem.
I'm using SASS, I have compass installed, but don't need to use it because I have LiveReload.
With LiveReload I've pasted the script into my index2.html file. Then in Output Paths I have my sass/main.scss folder targeted to the css/main.css folder. However for some reason it still outputs to a stylesheet folder.
This is driving me nuts, how do I force SASS or lifereload to make sure I'm outputting to the correct folder? I never created the stylesheets folder and when I deleted and make a change and save my main.scss file it recreates the stylesheets folder and puts main.css inside that X_X
Edit: I believe it is a config file somewhere in this python project. I Found a config.rb file, but path seems fine there, so it must be another setting somewhere... I'm going to keep looking, or I could ask the Python dev Monday
config.rb
# Require any additional compass plugins here.
require 'compass/util'
require 'compass/browser_support'
require 'compass/sass_extensions'
require 'compass/version'
require 'compass/errors'
require 'compass_twitter_bootstrap'
require 'breakpoint'
require 'toolkit'
# Set this to the root of your project when deployed:
http_path = "/"
css_dir = "css"
sass_dir = "sass"
images_dir = "img"
javascripts_dir = "scripts/js"
environment = :production
output_style = (environment == :production) ? :compressed : :expanded
The problem was how it was setup by the previous developer, not that he was causing a bug, it was just the way he had it setup.
I created a new folder and moved my files there and now my SCSS files in the SASS folder does compile correctly into the CSS folder.
Just change your link to your css with the appropriate styles folder you speak of. Wouldn't that be just as quick of a solution?
I've got an existing project that uses vanilla SASS, and I'd like to add Compass to it. I've used Compass in the past, but have only used it with the compass create command.
I'm looking for a way to be able to utilize the power of compass by just importing the SCSS files that are associated with it, and not having to abide by the structure it gives.
How can I do this?
All you need for compass on a stand-alone project is the gem and config.rb. I copy/paste the config file from one project to another and then adjust settings such as plugin requirements and file structure. You can use any structure you like, as long as you set it up in the config file.
Here's an example from one of my current projects:
# Compass CSS framework config file
require 'susy'
require 'modular-scale'
require 'sassy-buttons'
require 'breakpoint'
require 'compass-css-arrow'
require 'rgbapng'
# Require any additional compass plugins here.
project_type = :stand_alone
# Set this to the root of your project when deployed:
http_path = "/"
sass_dir = "sass"
css_dir = "static/css"
images_dir = "static/images"
fonts_dir = "static/fonts"
javascripts_dir = "static/js"
line_comments = false
preferred_syntax = :scss
output_style = :expanded
relative_assets = true
According to Compass Documentation you can use
compass init rails path/to/project [--using blueprint]
I was using Sass on an existing site and decided to get Compass up and running on Win7x64. Ruby, HAML, Compass all installed fine (afaik).
I have a project at c:\project with a static files served out of c:\project\static with a directory structure that has to stay the same. I went into c:\project\static and ran this:
compass create css-compass
This resulted in the following dir structure
c:\project\static\css (previously existed; output css)
c:\project\static\css-sass (previously existed; source css)
c:\project\static\css-compass (the new compass dir created by compass)
And here is my config.rb:
# Require any additional compass plugins here.
# Set this to the root of your project when deployed:
http_path = "/"
css_dir = "..\\css"
sass_dir = "..\\css-sass"
images_dir = "images"
javascripts_dir = "javascripts"
When I go to c:\project\static and run compass watch compass-css, I get the following error:
Nothing to compile. If you're trying
to start a new project, you have left
off the directory argument. Run
"compass -h" to get help.
However, if I create symlinks inside c:\project\static\css-compass from css->..\css and css-sass => ..\css-sass then everything works just fine.
What the what?
facepalm
Apparently you need to set relative_assets = true in your config.rb file. Why this isn't the default is beyond me. Oh well!
im late :-)
You can also use relative Path's in project_path
Example
project_path = "../src/main/webapp/"
More Details in this Answer: Can't make grunt-contrib-compass work