Custom LightningCSS config

[sannajammeh]

Goals

1. Be able to configure LightningCSS using their config format
2. Ability to completely skip PostCSS step for Tailwind

Non-Goals

1. Rewrite of existing PostCSS plugins into LightningCSS

Background

Now that Turbopack is the preferred bundler, and LigtningCSS is the defualt processor for CSS, we should allow it to be configured similar to how PostCSS can be configured.

1. TailwindCSS currently runs through PostCSS rather than a direct LightningCSS plugin.
2. There is currently no way to extend LightningCSS with custom rules like postcss-global-data and similar.
3. Like your switch from Babel to SWC there should be a similar compat table

x-ref: #64580

Proposal

• Add documentation for how to extend LightningCSS
• Add a way to extend LightningCSS either through next.config.mjs or lightningcss.config.ts

// lightningcss.config.ts
import { transform, composeVisitors } from 'lightningcss';
import environmentVisitor from 'lightningcss-plugin-environment';
import doubleFunctionVisitor from 'lightningcss-plugin-double-function';

export default {
 visitor: composeVisitors([
    environmentVisitor({
      '--branding-padding': {
        type: 'length',
        value: {
          unit: 'px',
          value: 20
        }
      }
    }),
    doubleFunctionVisitor
  ])
}

[magictalent]

I completely agree that supporting a config-based approach (similar to PostCSS’s postcss.config.js) would make it much easier to customize or extend behavior without needing to eject or manually wrap transforms.

A few thoughts:
-Having lightningcss.config.ts or an option in next.config.mjs (like experimental.lightningCSS) would give developers flexibility while staying aligned with how SWC and Turbopack are configured today.

-Even if the initial goal isn’t to re-implement existing PostCSS plugins, it would be great if there’s at least a compatibility layer for common features (e.g., postcss-global-data, nesting, custom media).

-Skipping PostCSS for Tailwind could also improve cold-start times — maybe this could be a future optimization once LightningCSS supports plugin injection directly.

[FeelGoodInc]

I really need the ability to configure things like this https://lightningcss.dev/css-modules.html#custom-naming-patterns