JSPM

A very basic Rollup plugin to minify CSS in string templates, for users of inline CSS packages e.g. Goober and Styled JSX.

Usage

Install this package in your project:

# via npm
npm add -D rollup-plugin-minlinecss

# or pnpm
pnpm add -D rollup-plugin-minlinecss

# or yarn
yarn add -D rollup-plugin-minlinecss

Add the plugin to your Rollup config:

// rollup.config.js
import minlinecss from "rollup-plugin-minlinecss";

export default {
  plugins: [minlinecss()],
};

Available plugin options are given in plugin options.

The plugin can minify any string templates that contain CSS:

// works-with.ts

// with selectors
const globalStyles = `
  .example {
      ...
  }
  ...
`;

// without selectors
const Icon = styled("div")`
  color: white;
  ...
`;

// with template substitutions
const Dynamic = styled("div")`
  .${class} {
    color: ${color};
    ...
  }
  ...
`;
const Colored = styled("div")`
  color: ${color};
  ...
`;

// the method styled() came from Goober for demonstration
// but the plugin will work without it too

The plugin keeps all ending semi-colons, even if they are not technically needed, for compatability with mainstream packages.

Options

With full TypeScript typing and autocompletion support.

Have fun with this stupid little plugin.