Importaint

Compile CSS files with @import rules into a single, resolved CSS file.

Interface #

Compile a CSS file with imports into a resolved CSS file without imports.

positional arguments:
  input_path            a filepath or URL to a CSS file with imports that you
                        want to compile

optional arguments:
  -h, --help            show this help message and exit
  -out output_dir, --output output_dir
                        manually specify the output folder. For remote files,
                        defaults to desktop. For local files, defaults to the
                        input file folder.
  -m, --minify          minify the compiled CSS
  -rc, --remove_comments
                        remove comments from the compiled CSS
  -c, --copy            copy the compiled CSS to clipboard
  -v, --version         show program's version number and exit

Example #

importaint resolves both local and external imports.

Before #

The following example shows an uncompiled CSS file with two @import rules.

css
@import url("modules/module_a.css");
@import url("https://rafalkaron.github.io/modules/module_b.css");

/* list items */
li {
    margin: 0.8rem 0;
}

After #

The following example shows a compiled CSS file with resolved @import rules.

css
/* resolved module_a.css */
p {
  margin-top: 5rem;
}

/* resolved module_b.css */
a {
    text-decoration: none;
    border-bottom: 0.25rem solid blue;
}

a:hover,
a:active,
a:focus {
    color: blue;
}

/* list items */
li {
    margin: 0.8rem 0;
}

Extra features #

Apart from compiling CSS files, importaint enables you to:

  • Define a custom output directory
  • Remove /* comments */ from the compiled CSS code
  • Minify the compiled CSS code
  • Copy the compiled CSS code to clipboard

Use cases #

importaint is useful if you want to:

  • Optimize your CSS code
  • Implement a single compiled CSS file
  • Keep your code modular and produce monoliths for your customer