@pandell/postcss-config
Version:
Pandell PostCSS shared config
46 lines • 1.93 kB
JavaScript
import postcssCalc from "postcss-calc";
import postcssMixins from "postcss-mixins";
import postcssPresetEnv from "postcss-preset-env";
/**
* Creates an array of PostCSS plugins with the given settings.
* The default plugins are `postcss-mixins`, `postcss-preset-env`, and `postcss-calc`.
*
* @param settings
* Settings controlling CSS file processing.
* @returns
* An array of PostCSS plugins. This array can be used anywhere PostCSS configuration can
* be specified - e.g. `postcss.config.mjs` file, Webpack configuration, Vite configuration.
*/
export function defaultPostcssPlugins(settings) {
const customProperties = {};
for (const key in settings.variables) {
if (Object.prototype.hasOwnProperty.call(settings.variables, key)) {
customProperties[key] = settings.variables[key];
if (!key.startsWith("--")) {
customProperties[`--${key}`] = settings.variables[key];
}
}
}
const plugins = [
postcssMixins({ mixins: settings.mixins }),
postcssPresetEnv({
stage: 1,
autoprefixer: settings.disableAutoPrefixer ? false : { grid: "autoplace" },
features: {
"custom-properties": {
// while `importFrom` eventually will be deprecated, the changes are still in early discussion.
// see https://github.com/csstools/postcss-plugins/discussions/192 to follow along
disableDeprecationNotice: true,
importFrom: [{ customProperties }],
preserve: false,
},
"nesting-rules": true,
},
}),
postcssCalc({}), // not included in preset-env
];
return settings.extraPlugins && settings.extraPlugins.length
? plugins.concat(settings.extraPlugins)
: plugins;
}
//# sourceMappingURL=postcss.js.map