styled-components

Agrippa has first-class support for styled-components styling

This feature is looking for active feedback

If you’re using Agrippa with styled-components, we’d love to hear your thoughts and suggestions. Find us on GitHub or Twitter.

Enable styled-components styling generation

Agrippa can be set to generate styled-components styling by setting the options.styling field in agrippa.config.mjs to Styling.STYLED_COMPONENTS, like so:

// @ts-check
// note the new import
import { defineConfig, Styling } from "agrippa";

export default defineConfig({
  options: {
    styling: Styling.STYLED_COMPONENTS

    // ...
  },
  // ...
});

Styling.STYLED_COMPONENTS is equivalent to "styled-components", but using the built-in Styling enum is clearer and less prone to errors.

With this set, Agrippa will create a .styles.js or .styles.ts file in the component directory, with a basic template.