Less Plugin Module Resolver

!Github Action    

> Inspired by less-plugin-npm-import and babel-plugin-module-resolver

Adds the ability for less to set alias imports. Especially to handle usage like ~ in webpack when using Rollup or other bundlers.

Install

``shell


use npm

npm install less-plugin-module-resolver

use yarn

yarn add less-plugin-module-resolver

use pnpm

pnpm install less-plugin-module-resolver
`

Usage

`less
@import (less) '~normalize.css';
`

`js
const less = require('less');
const { LessPluginModuleResolver } = require('less-plugin-module-resolver');

less.render('input', {
plugins: [
new LessPluginModuleResolver({
alias: {
'~': '',
},
}),
],
});
`

Plugin Options

$3

The directory to resolve less files. Default to ''.

$3

`js
const less = require('less');
const { LessPluginModuleResolver } = require('less-plugin-module-resolver');

less.render('input', {
plugins: [
new LessPluginModuleResolver({
rootDir: path.resolve(__dirname, 'src'),
alias: {
$: (_, restPath) => styles${restPath}),
'^@mixins$': 'styles/mixins/index.less',
},
}),
],
});
`

When using the above configs:

`less


origin

@import "@mixins";
@import "$/variables/index.less";

converted to

@import "/User/me/project-foo/src/styles/mixins/index.less";
@import "/User/me/project-foo/src/styles/variables/index.less";
`

The alias config to resolve import less files. Alias key should be string including regexp string, corresponding replacer value should be string. You can use function replacer when the situation is more complicated.

More detailed api about alias see below:

#### alias key

Alias key should be a normal string or regexp string. Mind that regexp string will pass to RegexpConstructor and should be not enclosed between slashes but started with ^ or end with $.

##### More docs about RegexpPatternString

- RegexpPatternString
- RegExp#literal_notation_and_constructor

Note that you can use special replacement patterns from String.prototype.replace, like $1, $n. See String_Replace#specifying_a_string_as_a_parameter

`js
const less = require('less');
const { LessPluginModuleResolver } = require('less-plugin-module-resolver');

less.render('input', {
plugins: [
new LessPluginModuleResolver({
rootDir: path.resolve(__dirname, 'src'),
alias: {
'^@theme/(.+)': 'styles/theme/$1.less',
},
}),
],
});
`

#### alias value

Alias value should be a string replacer or function replacer. The function replacer is similar to the 2rd argument/callback in String.prototype.replace.

`ts
type StringReplacer = string;

type FunctionReplacer = (substring: string, ...args: any[]) => string;
``

License

MIT