Search code examples
sasscompass

How to generate single minify file of css using Compass?


I want to compile my sass file into single minify css in project.


Solution

  • Minifying with Sass

    In the command line, enter the following:

    $ sass --watch style.scss:style.css --style compressed
    

    Minifying with Compass

    First, make sure you’ve setup your project in Compass by entering the following in the command line:

    $ compass create path/to/your_project
    

    Afterwards, you’ll notice that Compass has created two folders in your project directory; /sass/ and /stylesheets/. It has also created a config.rb file.

    Open the config.rb file and you should see something that looks a little like the following:

    # Require any additional compass plugins here.
    
    # Set this to the root of your project when deployed:
    http_path = "/"
    css_dir = "stylesheets"
    sass_dir = "sass"
    images_dir = "images"
    javascripts_dir = "javascripts"
    
    # You can select your preferred output style here (can be overridden via the command line):
    output_style = :compressed # :expanded or :nested or :compact or :compressed
    
    # To enable relative paths to assets via compass helper functions. Uncomment:
    # relative_assets = true
    
    # To disable debugging comments that display the original location of your selectors. Uncomment:
    line_comments = false
    
    
    # If you prefer the indented syntax, you might want to regenerate this
    # project again passing --syntax sass, or you can uncomment this:
    # preferred_syntax = :sass
    # and then run:
    # sass-convert -R --from scss --to sass sass scss && rm -rf sass && mv scss sass
    

    In your config.rb file, Line 11 will likely be commented out with the # sign. Uncomment the output_style line so that it reads like the example above.

    Finally, you’ll want to get Compass to start watching for changes to your scss files. In the command line, enter:

    $ cd /path/to/your_project
    $ compass watch
    

    And finish!


    Credits