stylus-resources-loader
Stylus resources loader for Webpack, inspired by sass-resources-loader.
Loading a global settings file
A common request is to be able to load a settings file in each component without the need to explicity import it each time, e.g. to use stylus variables globally throughout all components. To accomplish this:
npm install stylus-resources-loader --save-dev
Then add the following webpack rule:
module: {
rules: [
{
test: /\.(styl|stylus)$/,
use: [
'style-loader',
'css-loader',
'postcss-loader',
'stylus-loader',
{
loader: 'stylus-resources-loader',
options: {
resources: './path/to/resources.styl',
resources: [
'./path/to/vars.styl',
'./path/to/mixins.styl'
]
}
}
]
}
]
},
As an example, if you are using vuejs-templates/webpack, modify build/util.js like so:
stylus: generateLoaders('stylus').concat({
loader: 'stylus-resources-loader',
options: {
resources: './path/to/resources.styl'
}
}),