next-optimized-classnames
Reduce all CSS classes produced by CSS modules to the smallest form possible
Classes are only optimized in production builds
Works with SASS/SCSS/CSS modules
Install
npm i next-optimized-classnames
Use
Standalone
// next.config.js
module.exports = require('next-optimized-classnames')()
With custom configuration
// next.config.js
module.exports = require('next-optimized-classnames')({
// Custom config
})
With other plugins
// next.config.js
module.exports = require('next-compose-plugins')(
[
[require('next-optimized-classnames')]
// Other plugins
],
{
// Your config
}
)
Example
next-optimized-classnames
Without <div class="Home_container_x83bc">
<h1 class="Home_title_x83bc">My website</h1>
<p class="Home_subtitle_x83bc">This is the BEST website ever!</p>
</div>
next-optimized-classnames
With <div class="a">
<h1 class="b">My website</h1>
<p class="c">This is the BEST website ever!</p>
</div>