Insert some import statements into an existing Less file.
I mainly created this because I wanted to insert my own variables into Bootstrap's main Less file to override some of the default variables. I found this to be the easiest way to do that in situations where I wanted to quickly be able to play around with editing things like
@grid-gutter-width while starting to develop a site or theme.
npm install less-import-inserter
var less =// Path to the less file to alterlessPath: path// Change the original bootstrap imports to be relative from this pathrelativeTo: __dirnameafter:'variables.less': 'styles/override-variables.less'append: 'styles/app.less';console;
This will take the
bootstrap.less file found at the path, and insert an
@import statement after the
@import. It will also append an
@import to the end of the file. The end result will look like this:
// Core variables and mixins"node_modules/bootstrap/less/variables.less";"styles/override-variables.less";"node_modules/bootstrap/less/mixins.less";// Other Bootstrap @imports..."styles/app.less";
Returns the less file with the added
The path to the less file that you want to be read and then insert
@import statements into.
options.less (optional, String)
If you don't want to pass in a path to a less file, you can pass in raw Less using this option.
options.relativeTo (optional, String)
Allows you to rewrite all the existing
@imports to be relative to this path from the directory of
lessPath. Using this option you can write the resulting output to this path and all the
@imports will work.
Each object will insert the values either before or after the specified key. The key will be searched for in all the existing
@import statements so it can be any part of the path. The values can either be a
String or an
Array of strings. Here's an example:
before:'utilities.less': 'styles/my-utilities.less'after:'variables.less':'styles/my-variables.less''styles/app/my-theme.less''mixins.less': 'styles/my-mixins.less'
This will do the following:
- Before the
utilities.lessimport, insert an import for
- After the
variables.lessimport, insert imports for
- After the
mixins.lessimport, insert an import for
So the file will be changed to look like this:
options.append (String or Array)
These work the same way as the values for
after except that they will be added to the end of the file instead of before or after an existing
Other Less tools
lessitizer which will take the resulting less from this an an input and create the css and write it to a file.
Tests and Code Coverage