Use Variable for Import Parameter in less

If you need to parameterize urls that will be used in the @import directive and imported into your .css files use the following.

@googlefonturl: "//fonts.googleapis.com/css?family=Roboto";
@import (css) url("@{googlefonturl}");

Which will generate the following at the top of your css output

@import url("//fonts.googleapis.com/css?family=Roboto");

The double quotes aren’t necessary but less adds them. If you wanted to pull in the remote css to your less use `(inline)` instead of css do this

@import (inline) url("@{googlefonturl}");

It is not recommended to do this with google fonts because the api uses browser sniffing so that it can the correct files for the device requesting fonts

One thought on “Use Variable for Import Parameter in less”

  1. I see you don’t monetize your website, i think there is one opportunity to earn extra cash on your
    blog, search in google for- idol4jp makes money

Leave a Reply

Your email address will not be published.