less-plugin-glob
Globbing support in Less-imports.
This plugin allows to import multiple files using glob expressions. Add this plugin and you can write import like this
"common/**"; "themes/**";
How to add plugins?
Section about plugins in Less documentation
Examples
lessc usage
npm install -g less less-plugin-glob
- Create file with import by glob, something like
@import "includes/**"
- Run
lessc --glob styles.less styles.css
and enjoy whole your styles concated by one line
Programmatic usage
- Install plugin locally
npm install less-plugin-glob
- Import it and add into
plugins
section of options.
less
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!
}
}