/* my-component.css *//* alias paths for other values or composition */@value colors: "./colors.css";/* import multiple from a single file */@value primary, secondary from colors;/* make local aliases to imported values */@value small as bp-small, large as bp-large from "./breakpoints.css";/* value as selector name */@value selectorValue: secondary-color;.selectorValue {color:secondary;}.header {composes:text-primary from colors;box-shadow:0 0 10px secondary;}@media bp-small {.header {box-shadow:0 0 4px secondary; }}@media bp-large {.header {box-shadow:0 0 20px secondary; }}
If you are using Sass along with this PostCSS plugin, do not use the colon : in your @value definitions. It will cause Sass to crash.
Note also you can import multiple values at once but can only define one value per line.