pejmanjohn
pejmanjohn

Reputation: 1057

Import of LESS variables in Rails 3

I have a global.less file in my assets folder where I've defined many site-wide variables.

To use these variables in other less files, I currently put this at the top of each file:

@import 'global';

This loads everything fine, but now I have a copy of global loaded into each and every less file. I'm wondering if there is a way to write the import just once in the project, and have the other less files be able to access it?

Upvotes: 2

Views: 808

Answers (1)

numbers1311407
numbers1311407

Reputation: 34072

There are just two small things you need to do to make this happen.

  1. Make application.css a .less file by renaming it to application.less or application.css.less.

  2. Remove the require_tree . sprocket directive, which would import the files in the stylesheets directory on its own, removing your ability to define the order.

Once those things are done, it should work as you expect, simply:

// in global.less
@foo: #FFFFFF;

// in foo.less
.foo {
  background-color: @foo;
}

// and finally in application.less
@import 'global';
@import 'foo';

Upvotes: 3

Related Questions