#css #css-parser #web #compiler #ast-parser

nightly bin+lib procss

A simple CSS parsing and transformation framework

17 releases

0.1.16 Jul 4, 2024
0.1.15 Nov 26, 2023
0.1.13 May 1, 2023
0.1.12 Feb 20, 2023
0.1.5 Nov 25, 2022

#12 in #css-parser

Download history 11/week @ 2024-03-27 15/week @ 2024-04-03 3/week @ 2024-04-10 6/week @ 2024-04-17 41/week @ 2024-04-24 23/week @ 2024-05-01 27/week @ 2024-05-08 44/week @ 2024-05-15 42/week @ 2024-05-22 30/week @ 2024-05-29 23/week @ 2024-06-05 14/week @ 2024-06-12 9/week @ 2024-06-19 11/week @ 2024-06-26 183/week @ 2024-07-03 66/week @ 2024-07-10

272 downloads per month
Used in 3 crates

Apache-2.0

135KB
2K SLoC

PROCSS

CI

A simple CSS parsing and transformation framework.

Docs

Developer Setup

Build

cargo xbuild

Test

cargo xtest

Test coverage report (disables incremental builds)

cargo xtest --coverage

Lint

cargo clippy

Bench

cargo xbench

Generate docs (output at ./target/doc/procss/index.html)

cargo doc

lib.rs:

A simple CSS parsing and transformation framework. Procss can be used to quickly bundle a collection of CSS+ files, or write your own custom transforms.

Usage

Procss's parser understands a nested superset of CSS (which we refer to as CSS+), similar to the CSS nesting proposal, or languages like Sass. Start with source CSS+ as a [str], use crate::parse or crate::parse_unchecked to generate an ast::Tree.

use procss::{ast, parse};

let ast = procss::parse("div{.open{color:red;}}").unwrap();

The resulting ast::Tree can be converted to a de-nested ast::Css with the ast::Tree::flatten_tree method, which itself can then be rendered as a plain browser-readable CSS string via the RenderCss::as_css_string trait method.

use procss::RenderCss;

let flat: ast::Css = ast.flatten_tree();
let css: String = flat.as_css_string();
assert_eq!(css, "div .open{color:red;}");

Intermediate structs ast::Css::transform amd ast::Tree::transform can be used to recursively mutate a tree for a variety of node structs in the [ast] module. Some useful Example of such transforms can be found in the transformers module.

use procss::transformers;

let test = "
@mixin test {color: red;}
div {@include test;}
";

let mut ast = procss::parse(test).unwrap();
transformers::apply_mixin(&mut ast);
let mut flat = ast.flatten_tree();
transformers::remove_mixin(&mut flat);
let css = flat.as_css_string();
assert_eq!(css, "div{color:red;}");

For coordinating large builds on a tree of CSS files, the BuildCss struct can parse and minify, applying all transforms (including transformers::apply_import) as the compilation is left-folded over the inputs.

let mut build = procss::BuildCss::new("./src");
build.add_file("controls/menu.scss");
build.add_file("logout.scss"); // imports "controls/menu.scss"
build.add_file("my_app.scss"); // imports "controls/menu.scss" and "logout.scss"
build.compile().unwrap().write("./dist").unwrap();

Dependencies

~5–9MB
~167K SLoC