Stylus 插件
Stylus 是一个富于表现力、动态的、健壮的 CSS 预处理器；通过 Stylus 插件，你可以使用 Stylus 作为 CSS 预处理器。
快速开始
安装插件
你可以通过如下的命令安装插件:
npm add @rsbuild/plugin-stylus -D注册插件
你可以在 rsbuild.config.ts 文件中注册插件：
rsbuild.config.ts
import { pluginStylus } from '@rsbuild/plugin-stylus';
export default {
plugins: [pluginStylus()],
};示例
注册插件后，你可以在代码中引入 *.styl，*.stylus，*.module.styl 或 *.module.stylus 文件，无须添加其他配置。
normalize.styl:
body
color #000
font 14px Arial, sans-seriftitle.module.styl:
.title
font-size: 14px;index.js:
import './normalize.styl';
import style from './title.module.styl';
console.log(style.title);选项
如果你需要自定义 Stylus 的编译行为，可以使用以下配置项。
stylusOptions
- 类型：
type StylusOptions = {
use?: string[];
define?: [string, any, boolean?][];
include?: string[];
includeCSS?: boolean;
import?: string[];
resolveURL?: boolean;
lineNumbers?: boolean;
hoistAtrules?: boolean;
};- 默认值：
undefined
传递给 Stylus 的选项，请查阅 Stylus 文档 来了解具体用法。
pluginStylus({
stylusOptions: {
lineNumbers: false,
},
});sourceMap
- 类型：
boolean - 默认值： 与 output.sourceMap.css 一致
是否生成 source map 文件。
pluginStylus({
sourceMap: false,
});