Registry / web-framework / stylus-loader

stylus-loader

JSON →
library8.1.3jsnpmunverified

Webpack loader that compiles Stylus (.styl) files into CSS. Current stable version is 8.1.3, released February 2026, with regular bugfix updates. Maintained by the webpack team. Key differentiator: first-class webpack integration, supports webpack resolve and loaders, optional Rspack compatibility since v8.1.0, and incremental build optimization. Requires Node.js >=18.12.0 (v8) and Stylus >=0.52.4 as a peer dependency. Alternatives like stylus itself require separate CLI usage or manual integration.

npm install stylus-loader
INSTALL
IMPORT
SIG · STYLUS-LOADER
S
stylus-loader
web-frameworkjavascriptv8.1.3
Install
Import
Disk
Pass rate
0/ 6
Env Coverage0 / 6
glibc
1822
musl
1822
Install & Compatibility
Where this runs
tested against v? · npm install
Install × environment matrix
Each cell = how many times install + import succeeded across repeated harness runs. Partial = flaky.
glibc = Debian/Ubuntu slim · musl = Alpine Linux
musl
node 18226 runs
build_error
glibc
node 18226 runs
build_error
Code
Verified usage

Verified import paths — ran on the pinned version, not inferred.

StylusLoader
import stylusLoader from 'stylus-loader'
const stylusLoader = require('stylus-loader')
CommonJS require works but default export is typically used as loader string, not imported programmatically.
Webpack config
{ test: /\.styl$/, loader: 'stylus-loader' }
{ test: /\.styl$/, use: 'stylus-loader' }
Both work, but 'loader' is more concise when no other loaders are chained.
stylusOptions
{ test: /\.styl$/, use: [{ loader: 'stylus-loader', options: { stylusOptions: { /* ... */ } } }] }
{ test: /\.styl$/, use: [{ loader: 'stylus-loader', options: { /* stylus options directly */ } }] }
Stylus options must be nested under 'stylusOptions' key, not flattened.

Basic webpack configuration to load Stylus files with style-loader, css-loader, and stylus-loader, including source maps.

// webpack.config.js const path = require('path'); module.exports = { mode: 'development', entry: './src/style.styl', output: { path: path.resolve(__dirname, 'dist'), filename: 'bundle.js' }, module: { rules: [ { test: /\.styl$/, use: [ { loader: 'style-loader' }, { loader: 'css-loader', options: { sourceMap: true } }, { loader: 'stylus-loader', options: { stylusOptions: { compress: false } } } ] } ] } };
Debug
Known issues
breakingNode.js version requirement raised
fix
Upgrade to Node.js 18.12.0 or higher
affects: >=8.0.0
gotchaStylus options must be nested under `stylusOptions`
fix
Wrap Stylus options in `stylusOptions: { ... }`
affects: >=7.0.0
breakingMinimum Stylus version requirement
fix
Use Stylus >=0.52.4
affects: >=7.0.0
deprecated`define` option as an object is deprecated
fix
Use array syntax for `define`: [[key, value, raw]]
affects: >=7.0.0
gotchaOptions in dash-case must be camelCase
fix
Use `lineNumbers` instead of `line-numbers`, etc.
affects: >=7.0.0
Errors
Common errors & fixes
Error: Module build failed (from ./node_modules/stylus-loader/dist/cjs.js): TypeError: Cannot read properties of undefined (reading 'stylus')
Stylus is not installed or not a peer dependency
fix
npm install stylus --save-dev
Error: Node.js version 14.15.0 is not supported. Please upgrade to Node.js 18.12.0 or higher.
Using stylus-loader v8 with older Node.js
fix
Upgrade Node.js to 18.12.0+
Warning: The define option as an object is deprecated. Use array syntax.
Using object syntax for `define` in stylusOptions
fix
Change to array: `define: [['var', value, raw]]`
Upgrade
Version history
8.1.3latest on npm
Audit
Dependencies
stylusrequiredCompiles Stylus to CSS
webpackrequiredLoader integration
Agent activity
6 hits · last 30 days
node
4
Resources
stylus-loader — npm install stylus-loader · libregistry