CODEWITHSUNDEEP
csscommand-linesass
Arete
Arete

Reputation: 1004

SASS compile expanded and compressed CSS and rename the output

I am using the command line sass --watch style.scss --style compressed to output a compressed CSS version of my SCSS style sheet.

Is there a way to output one expanded and one compressed CSS file, calling them respectively style.css and style.min.css?

I read the documentation without finding any information on this.

Upvotes: 3

Views: 5356

Answers (2)

Vintr
Vintr

Reputation: 435

You could run two terminal windows, each with one watcher in it. In one you would run

sass --watch style.scss:style.css --style nested

and in the other you would run

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

I am unaware of a method to do this in one line.

Upvotes: 3

Teejten
Teejten

Reputation: 70

Your best bet would be to go with a task manager like Gulp or Grunt. Then you can specify two separate task for SASS and run grunt compile (using the Grunt example below). One for compressed and one for expanded. Otherwise I would just run another command on the terminal if you don't wan to mess with the config.

sass: {

expanded: {
    options: {
         style: 'expanded'
    },
    files: {
         'css-expanded/*.css': 'sass/*.scss'
    }
}
compressed: {
    options: {
         style: 'compressed'
    }
    files: {
         'css-compressed/*.min.css': 'sass/*.scss'
    }
}

grunt.registerTask('compile': ['sass:expanded', 'sass:compressed']);

Upvotes: 4

Related Questions