Webpack loader for importing style dependencies (Less/Sass).
$ npm install style-import-loader --save-dev
Add style-import-loader before less-loader or sass-loader
{
test: /\.less$/,
loader: "style!css!less!style-import"
}
styleImportLoader: {
base: process.cwd() + '/src/less/base' // must be absolute path
},
module: {
loaders: [
{
test: /\.less$/,
loader: 'style!css!less!style-import'
}
]
}
Add multiple loader configs with loader query.
// default config key
styleImportLoader: {
base: path.join(process.cwd(), 'less/base')
},
// custom config key
sassImportLoader: {
base: path.join(process.cwd(), 'sass/base')
},
module: {
loaders: [
// using default
{
test: /\.less$/,
loader: 'style!css!less!style-import'
},
// using custom config
{
test: /\.scss$/,
loader: 'style!css!sass!style-import?config=sassImportLoader'
}
]
}
a {
color: white;
}
@import "../less/base";
a {
color: white
}