CSS Modules classes removed in .vue file

When reporting a bug, please be sure to include the following:

• A descriptive title
• An isolated way to reproduce the behavior
• What version of purgecss you’re using, and the platform(s) you’re running it on: purgecss-webpack-plugin@^0.20.0
• The behavior you expect to see, and the actual behavior: Do not remove CSS Modules classes, but they are actually removed

reproduce repository: https://github.com/JounQin/blog/tree/purgecss branch: purgecss reproduce step:

Add a .env.local file in project directory like following

NODE_ENV=development

APP_KEYS=APP_KEYS

GITHUB_TOKEN= # add an usable token for GitHub API

Then run yarn dev to see correct UI and run yarn build && yarn start to see generated version after purgecss enabled.

[JounQin]

@jsnanigans I know classes with be compiled into hash string after building, so I title this issue CSS Modules classes are removed.

And after reading purifycss-webpack’s suggestion about CSS Modules, I find out that I can simply set localIdentName to prefix with _ and add whitelistPatterns: [/^_/] option (I was thinking whitelist and whitelistPatterns are matching source classnames 😂) and it works.

Util a better solution to deal with CSS Modules, it can be documented as a workaround like purifycss-webpack.

[JounQin]

@jsnanigans Is that related to Vue only? CSS Modules can be used with any other frameworks, right?