Awesome Open Source
Awesome Open Source
Sponsorship

less-plugin-glob

Globbing support in Less-imports.

Travis status npm version David

This plugin allows to import multiple files using glob expressions. Add this plugin and you can write import like this

@import "common/**";
@import "themes/**";

How to add plugins?

Section about plugins in Less documentation

Examples

lessc usage

  1. npm install -g less less-plugin-glob
  2. Create file with import by glob, something like @import "includes/**"
  3. Run lessc --glob styles.less styles.css and enjoy whole your styles concated by one line

Programmatic usage

  1. Install plugin locally npm install less-plugin-glob
  2. Import it and add into plugins section of options.
less.render(lessString, { plugins: [require('less-plugin-glob')] })

If you are using Gulp or Grunt or something else, you can import and add plugin by same way as well.

Usage with webpack and less-loader

When using webpack and less-loader >= 4.0, it's important to make sure that less-loader is configured not to use its webpack resolver, which is now active by default. Otherwise, less-plugin-glob won't run at all because less-loader applies a LESS plugin that passes all queries to the webpack resolver (bypassing this plugin). To make less-loader revert to the LESS resolver, specify the paths loader option:

{
  loader: "less-loader",
  options: {
    plugins: [lessPluginGlob],
    paths: [path.resolve(__dirname, "path/to/my/styles")] // This is the important part!
  }
}

Get A Weekly Email With Trending Projects For These Topics
No Spam. Unsubscribe easily at any time.
javascript (66,106
less (137
glob (26

Find Open Source By Browsing 7,000 Topics Across 59 Categories