For some reason grunt-contrib-sass generates a combined .css file instead of multiple .css files. But this only happens when I define the ext option.
File structure:
app/
assets/
stylesheets/
application.web.scss
application.mobile.scss
application.tablet.scss
public/
assets/
Gruntfile.js Config
sass: {
default: {
options: {
compass: false,
noCache: true,
style: 'expanded'
},
files: [{
expand: true,
src: 'application.**.scss',
dest: 'public/assets',
cwd: 'app/assets/stylesheets',
ext: '.css'
}]
}
}
The above configuration generates the following:
app/
assets/
stylesheets/
application.web.scss
application.mobile.scss
application.tablet.scss
public/
assets/
application.css
If I remove the ext option completely it generates:
app/
assets/
stylesheets/
application.web.scss
application.mobile.scss
application.tablet.scss
public/
assets/
application.web.scss
application.mobile.scss
application.tablet.scss
What I want it to generate is:
app/
assets/
stylesheets/
application.web.scss
application.mobile.scss
application.tablet.scss
public/
assets/
application.web.css
application.mobile.css
application.tablet.css
I know I'm probably overlooking a very basic thing, but I cannot seem to solve this for the life of me XD So any ideas on what I'm doing wrong?
Apparently the problem was that the filenames contained multiple dots. And this gets confused with the extension. To fix this I was supposed to use the extDot attribute to define on which dot does the extension start. I found this answer here https://github.com/gruntjs/grunt/pull/863#issuecomment-22015455 which points to the actual documentation here http://gruntjs.com/configuring-tasks#building-the-files-object-dynamically