whatisgithub

What is postcss-modules?

yyx990803/postcss-modules — explained in plain English

Analysis updated 2026-07-17 · repo last pushed 2020-11-25

7Audience · developerComplexity · 2/5DormantSetup · moderate

In one sentence

A PostCSS plugin that automatically renames CSS class names to be unique, preventing style conflicts and generating a JSON map to look up the renamed classes in your templates.

Mindmap

mindmap
  root((postcss-modules))
    Inputs
      Plain CSS files
      Class names
    Outputs
      Renamed unique classes
      JSON class map
    Use Cases
      Prevent class conflicts
      Isolate component styles
      Use with Pug or PostHTML
    Tech Stack
      PostCSS
      JavaScript
      JSON

Code map

Detail Auto

An interactive map of this repo's files and how they connect — its source is parsed live in your browser. Click Visualize to build it.

filefunction / class

What do people build with it?

USE CASE 1

Automatically rename CSS classes to unique names so components stop clashing over shared class names.

USE CASE 2

Generate a JSON map from original class names to renamed ones for use in HTML templates.

USE CASE 3

Mark specific CSS rules as global so they skip the automatic renaming.

USE CASE 4

Build server-side rendered sites with isolated, conflict-free component styles.

What is it built with?

PostCSSJavaScriptJSON

How does it compare?

yyx990803/postcss-modules0xsv1/ghosttype-bofadguardteam/ruleseditor
Stars777
LanguageCTypeScript
Last pushed2020-11-252026-07-01
MaintenanceDormantActive
Setup difficultymoderatehardeasy
Complexity2/54/52/5
Audiencedeveloperdeveloperdeveloper

Figures from each repo's GitHub metadata at analysis time.

How do you get it running?

Difficulty · moderate Time to first run · 30min

Requires wiring the generated JSON class map into your template or component code.

License is not stated in the available content.

Copy-paste prompts

Prompt 1
Set up postcss-modules in my PostCSS pipeline to automatically rename CSS class names and generate a JSON map.
Prompt 2
Show me how to customize the generated class name format in postcss-modules using the filename and a hash.
Prompt 3
Help me mark a block of CSS as global in postcss-modules so it isn't renamed.
Prompt 4
Integrate postcss-modules output with Pug templates so renamed class names appear automatically in my markup.

Frequently asked questions

What is postcss-modules?

A PostCSS plugin that automatically renames CSS class names to be unique, preventing style conflicts and generating a JSON map to look up the renamed classes in your templates.

Is postcss-modules actively maintained?

Dormant — no commits in 2+ years (last push 2020-11-25).

What license does postcss-modules use?

License is not stated in the available content.

How hard is postcss-modules to set up?

Setup difficulty is rated moderate, with roughly 30min to a first successful run.

Who is postcss-modules for?

Mainly developer.

Open on GitHub → Ask about another repo

This repo across BitVibe Labs

Verify against the repo before relying on details.