LightningCSS is an exceptionally fast CSS parser, transformer, bundler, and minifier, leveraging the performance benefits of Rust. Currently stable at version 1.32.0, it maintains an active and frequent release cadence, often issuing minor or patch updates every few weeks. Key differentiators include its speed, boasting over 100x faster processing than JavaScript-based alternatives and capable of minifying millions of lines of code per second. It utilizes a browser-grade parser based on Mozilla's `cssparser` and processes typed property values, ensuring accuracy and consistency. The library offers extensive minification optimizations, including combining shorthands, merging adjacent rules, reducing `calc()` expressions, and converting colors to shorter formats. It also provides vendor prefixing, syntax lowering for older browsers, support for CSS Modules, and robust source map generation. Crucially, LightningCSS guarantees that its output CSS behaves identically to the input, avoiding unsafe optimizations that might alter styling for file size reductions.
npm install lightningcss-freebsd-x64Verified import paths — ran on the pinned version, not inferred.
This example demonstrates how to use the `transform` function from `lightningcss` to parse, minify, transpile modern CSS features for specified browser targets, and generate a source map. It includes setting up browser targets using `browserslist`.
Review CSS code involving relative color calculations. If percentages were used where numbers are now expected by the spec, convert them to their numerical equivalents. Refer to the official v1.30.0 release notes for specific details.
Prefer ES Module `import` syntax (`import { symbol } from 'lightningcss';`) in your Node.js projects. Ensure your project is configured for ESM (e.g., `"type": "module"` in `package.json`). If CommonJS is unavoidable, investigate dynamic `import()` or specific transpilation configurations.Ensure `npm` can correctly identify and install the appropriate native module for your runtime environment. For Docker, build images on the target architecture or ensure multi-arch builds are correctly configured. Avoid `npm install --force` unless absolutely necessary and understand its implications. If errors occur, try deleting `node_modules` and `package-lock.json` and reinstalling.
For cases where invalid third-party CSS cannot be fixed, enable the `errorRecovery` option in the API (`transform({ errorRecovery: true })`) or use the `--error-recovery` CLI flag. This will skip invalid rules and declarations, emitting warnings instead of errors.Always place `@import` statements at the very top of your CSS files, after any `@charset` or `@layer` rules, but before any other `@rule` or style declarations.
Clear your `node_modules` directory and `package-lock.json` (or `yarn.lock`), then reinstall dependencies. For Docker environments, ensure the build process correctly identifies and installs the native module for the container's architecture or use multi-arch builds.
Review the CSS code around the indicated token for syntax errors. If the error originates from third-party CSS that cannot be directly fixed, consider using the `errorRecovery: true` option in the `transform` or `bundle` API call to skip invalid constructs.
Rearrange your CSS to ensure all `@import` rules are declared at the very beginning of the stylesheet, following only `@charset` or `@layer` rules if present.
No dependency data recorded yet.