Stylus
Parcel 使用 @parcel/transformer-stylus
插件自动支持 Stylus 文件。当检测到 .styl
文件时,它将自动安装到您的项目中。
编译后的 Stylus 文件也与 CSS 文件的处理方式相同,这意味着它将针对您的浏览器目标进行编译,并且还会应用任何 PostCSS 插件。通过使用 .module.styl
扩展名命名文件,也可以使用 CSS 模块。
示例用法
#在 HTML 文件中引用 Stylus 文件
<link rel="stylesheet" href="style.styl" />
在 JavaScript 或 TypeScript 中将 Stylus 文件作为 CSS 模块导入
import * as classes from './style.module.styl';
document.body.className = classes.body;
使用 Parcel CLI 直接编译 Stylus
parcel build style.styl
配置
#要配置 Stylus,请创建一个 .stylusrc
文件。要查看配置 stylus 的可用选项,请参阅官方 Stylus 文档。
注意:.stylusrc.js
、.stylusrc.mjs
和 .stylusrc.cjs
也支持基于 JavaScript 的配置,但应尽可能避免使用,因为这会降低 Parcel 缓存的有效性。请改用基于 JSON 的配置格式(例如 .stylusrc
)。