npm install @csstools/postcss-syntax-descriptor-syntax-production --save-devPostCSS Syntax Descriptor Syntax Production lets you use the <syntax> production in syntax descriptors following the CSS Specification.
@property --color {
inherits: true;
initial-value: black;
syntax: <color>;
}
/* becomes */
@property --color {
inherits: true;
initial-value: black;
syntax: "<color>";
}Add PostCSS Syntax Descriptor Syntax Production to your project:
npm install postcss @csstools/postcss-syntax-descriptor-syntax-production --save-devUse it as a PostCSS plugin:
const postcss = require('postcss');
const postcssSyntaxDescriptorSyntaxProduction = require('@csstools/postcss-syntax-descriptor-syntax-production');
postcss([
postcssSyntaxDescriptorSyntaxProduction(/* pluginOptions */)
]).process(YOUR_CSS /*, processOptions */);PostCSS Syntax Descriptor Syntax Production runs in all Node environments, with special instructions for:
The preserve option determines whether the original notation
is preserved. By default, it is not preserved.
postcssSyntaxDescriptorSyntaxProduction({ preserve: true })@property --color {
inherits: true;
initial-value: black;
syntax: <color>;
}
/* becomes */
@property --color {
inherits: true;
initial-value: black;
syntax: "<color>";
syntax: <color>;
}