@imports and mix-ins?

Chris G's Avatar

Chris G

14 Jun, 2010 02:09 PM

The documentation page says that, when you use @import to read multiple less files, "all the variables in it will be available". I took that to mean that variables in one would be available in another, and this doesn't seem to be the case for me. If this isn't the intended functionality, well, it would be really cool if it was.

My site is structured to rely on different stylesheets for different components/modules, and it would be really nice to have a master sheet full of mixins and variables to pull classes from those other stylesheets together on an ad hoc basis.

  1. 1 Posted by Matthew R on 25 Jun, 2010 04:52 AM

    Matthew R's Avatar

    Absolutely agree, Chris. I just stumbled on Less, and this is the first thing I tried to do.

  2. 2 Posted by adrian on 27 Jun, 2010 02:46 AM

    adrian's Avatar

    Yeah, I'm making a port of the blueprint grid system to work efficiently with mixins and because mixins aren't imported the code has to manually be added to the file which makes it harder to navigate (with 80 extra lines of code)

  3. 3 Posted by Will on 04 Jul, 2010 07:43 PM

    Will's Avatar

    Interesting, it seems to be working fine for me. I'm using Less.app for OS X which uses Less.js. I have a tools.less where I define things with -moz-, -webkit-, and -o- prefixes. At the beginning of every stylesheet, I have @import "tools";, and it works as expected, with both mixins and variables.

  4. 4 Posted by adrian on 05 Jul, 2010 07:13 PM

    adrian's Avatar

    Yeah, I'm using less.js, and planed to compile it later with less.app for deployment, but less.app uses a different compiler from less.js so maybe less.js (still a work in progress) doesn't support importing mixins

  5. 5 Posted by Will P on 05 Jul, 2010 10:56 PM

    Will P's Avatar

    The newest version of Less.app (the one I tested on) does use Less.js. From the website: "LESS.app is a graphical interface for LESS.js.”

  6. 6 Posted by adrian on 05 Jul, 2010 11:01 PM

    adrian's Avatar

    I found out on twitter that a new version was coming out a day early and then forgot to get it the next day... So I guess you just need to use less.app

  7. 7 Posted by Tom on 07 Dec, 2011 06:59 PM

    Tom's Avatar

    This post is a little old, but I'm running into the same issue. I've set up 4 .less files like:
    - main.less - variables.less - mixins.less - sitestyles.less

    I'm compiling using less.app.
    main.less has @import calls to each .less file, but sitestyles.less throws an error because it can't find a var or a mixin.

    I've also tried importing vars and mixins straight into sitestyles.less but again the compiler throws an error. However, I can import/compile self-contained .less files into another .less file.

    Can anyone offer suggestions on how to best share vars/mixins?

  8. 8 Posted by Tom on 07 Dec, 2011 07:34 PM

    Tom's Avatar

    Love it when I mix syntax.
    I was using CSS @import, not LESS (@import "filename.less"). Fixed, working perfectly.

Reply to this discussion

Internal reply

Formatting help / Preview (switch to plain text) No formatting (switch to Markdown)

Attaching KB article:


Attached Files

You can attach files up to 10MB

If you don't have an account yet, we need to confirm you're human and not a machine trying to post spam.

Keyboard shortcuts


? Show this help
ESC Blurs the current field

Comment Form

r Focus the comment reply box
^ + ↩ Submit the comment

You can use Command ⌘ instead of Control ^ on Mac