Less

Instalación

Necesitas instalar el plugin @rsbuild/plugin-less:

pnpm
npm
yarn
bun
pnpm add -D @rsbuild/plugin-less less

Configuración

Agregar el plugin en addfox.config.ts:

import { defineConfig } from "addfox";
import { pluginLess } from "@rsbuild/plugin-less";

export default defineConfig({
  plugins: [pluginLess()],
});

Uso

Después de instalar y configurar, puedes crear e importar archivos .less directamente:

/* app/popup/index.less */
@brand: #2563eb;

.btn {
  background: @brand;
  color: #fff;
}
import "./index.less";

Notas

  • Se recomienda usar nombres de clase con espacio de nombres en escenarios de content para evitar contaminar los estilos de la página
  • El plugin procesará automáticamente la compilación e importación de archivos Less