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