Skip to content

CLI

The command line interface for Stilvoll. Made for tech-stacks not using a Javascript build pipeline, so it’s the perfect fit for Kirby, Wordpress, etc.

Installation

  1. Install stilvoll and @stilvoll/cli

    Terminal window
    npm install -D stilvoll @stilvoll/cli
  2. Create a stilvoll.config.js file:

    stilvoll.config.js
    export default {
    input: ["./src/index.css"],
    // When using the CLI you'll need to define
    // an output path
    output: "./dist/utils.css",
    // By default the glob shown below is used to
    // find any files to parse for utility classes
    // used. You might need to tweak this, based
    // on your setup
    entries: [
    "**/*.{html,js,ts,jsx,tsx,vue,svelte,astro,elm,php,phtml,mdx,md}",
    ],
    rules: [
    // Define or use imported rules here
    ],
    };
  3. Run the CLI to generate your utility CSS.

    Terminal window
    stilvoll

You can also run the CLI in watch mode, so changes made to your CSS or markup files trigger a rebuild.

Terminal window
stilvoll --watch

…or set them up as npm scripts

package.json
{
"scripts": {
"dev": "stilvoll --watch",
"build": "stilvoll"
},
"devDependencies": {
"@stilvoll/cli": "latest",
"stilvoll": "latest"
}
}

Options

Options
-v, --versionDisplay the current version of Stilvoll
-w, --watchRun in watch mode, file changes trigger a rebuild
-t, --typesGenerate type definitions only, skipping CSS output
--verboseOutput additional debug information
--dryDry run, don’t write any files