0

I am looking for a way to put a version parameter in the url tail of some @import statements in sass file:

@import url('custom-style.css?v='+random(99999));
@import url('custom-style-mobile.css?v='+random(99999));

Grunt sass doesn't seems to reject this statement, but cssmin task does:

Running "cssmin:minify" (cssmin) task Warning: Broken @import declaration of "custom-style.css?v=1" Use --force to continue.

cssmin: {
            options: {
                keepSpecialComments: 1
            },
            minify: {
                expand: true,
                cwd: '<%= paths.dest.css %>',
                src: ['*.css', '!*.min.css'],
                dest: '<%= paths.dest.css %>',
                ext: '.min.css'
            }
        },

There is a way to avoid this warning?

ale
  • 10,012
  • 5
  • 40
  • 49
  • Try appending an empty string. @import url('custom-style.css?v='+random(99999)+""); – Revive Jun 28 '17 at 13:16
  • same result.... – ale Jun 28 '17 at 15:50
  • Why not generate the version number after the file is generated. Or in the template where you include the link? Its weird, dont understand why cssmin will validate the content inside the url. And why are you importing .css rather than .sass ? – karthick Jun 28 '17 at 17:58
  • @karthick long story short, I am doing a skin for a website on top an existent stylesheet, it a not responsive website and I can't modify the markup. Someone asked me to make possible to add/remove the mobile version from production without the need of a "build", and because this website is updated just by xcopy – ale Jun 28 '17 at 20:08
  • Does it give an error even if you give the entire url like a string @import url('custom-style.css?v=1' ) – karthick Jun 28 '17 at 20:16
  • @karthick yes, it is just the '?' char, btw, yes I can avoid this problem in another manner, it is just curiosity – ale Jun 28 '17 at 20:16
  • I dont have grunt set up in my machine. But when I tried to import this in my css @import url(https://cdn.sstatic.net/Sites/stackoverflow/all.css?v=16e62901cfbc); and use gulp-clean-css, which is powered by clean-css the same library that runs on grunt, it works fine. The clean-css version is 4.1.4 – karthick Jun 28 '17 at 20:25
  • I think I missed it. '?' will work only for files which are preceded by a protocol like http or https. Not when you specify just a file name with '?' – karthick Jun 28 '17 at 20:43

1 Answers1

1

The issue is because the question mark '?' is added to a file rather than an url. try giving an http reference to the same resource or the cdn link then it will work.

$rand: random(99999);
@import url("http://yourcdn.com/custom-style.css?v=#{$rand}");
karthick
  • 11,998
  • 6
  • 56
  • 88