SASS / SCSS
Plugin de preprocesamiento SASS.
El plugin @bdocs/plugin-sass añade soporte oficial para archivos .scss y .sass en Boltdocs mediante la configuración del preprocesador en Vite.
Instalación
Instala @bdocs/plugin-sass y sass-embedded:
bash
pnpm add -D @bdocs/plugin-sass sass-embedded
Opciones del Plugin
| Opción | Tipo | Descripción |
|---|---|---|
additionalData | string | SASS/SCSS añadido al inicio de cada bloque de código CSS (ideal para variables/mixins globales). |
api | 'modern' | 'legacy' | Modo de la API de SASS (por defecto: 'modern'). |
includePaths | string[] | Directorios adicionales para resolución de @use y @import en modo legacy. |
loadPaths | string[] | Directorios adicionales para resolución de @use e @import en modo modern. |
| Otras opciones Sass | Opciones Sass | Opciones como quietDeps y silenceDeprecations se aplican tanto a SCSS como a Sass indentado. |
Ejemplo de Componente SCSS
styles/card.module.scss
.card {
background: var(--bdocs-bg-secondary);
border: 1px solid var(--bdocs-border);
border-radius: 0.5rem;
padding: 1.5rem;
&:hover {
border-color: var(--bdocs-primary);
}
}
tsx
import styles from './card.module.scss'
export function Card({ children }: { children: React.ReactNode }) {
return <div className={styles.card}>{children}</div>
}
Last updated on October 18, 2026