This Babel plugin minifies CSS code embedded within a template literal. Simply tag the template literal with a leading /* css */
comment to activate the plugin.
Input
const css = /*css*/`
body {
height: 100%;
}
`;
Output
const css = /*css*/`body{height: 100%;}`;
The plugin doesn't require any configuration in itself. Your .babelrc
file can be as simple as this:
.babelrc
{ "plugins": ["babel-plugin-template-css-minifier"] }
Due to Babel's first-to-last plugin ordering, this plugin should be placed at or near the beginning of the list of plugins so that it runs before template literals are transformed by another plugin.