Lightning CSS

Options

Description

The lightningcss plugin bundles your CSS files using the Lightning CSS processor.

Installation

Import this plugin in your _config.ts file to use it:

import lume from "lume/mod.ts";
import lightningCss from "lume/plugins/lightningcss.ts";

const site = lume();

site.use(lightningCss(/* Options */));
site.add("style.css"); //Add the entry point(s)

export default site;

Configuration

Example with the default configuration:

import lume from "lume/mod.ts";
import lightningCss, { version } from "lume/plugins/lightningcss.ts";
import { version } from "lume/core/utils/browsers.ts";

const site = lume();

site.use(lightningCss({
  includes: "_includes",
  options: {
    minify: true,
    drafts: {
      customMedia: true,
    },
    targets: {
      android: version([100, 0]),
      chrome: version([100, 0]),
      edge: version([100, 0]),
      firefox: version([100, 0]),
      ios_saf: version([18, 4]),
      safari: version([16, 0]),
    },
  },
}));

export default site;