Add an option to pass plugins to patchPostCSS in webpack.config.js

I’m submitting a…

[ ] Regression (a behavior that used to work and stopped working in a new release)
[ ] Bug report  
[ ] Performance issue
[X] Feature request
[ ] Documentation issue or request
[ ] Support request
[ ] Other... Please describe:

It would be cool to pass an array of postcss plugins to patchPostCSS and append them after tailwind. (As an optional argument)

[vltansky]

@TryHardDood I’m working on this kind of plugin. It’s still in development stage, but you can give it a try: https://github.com/vltansky/patchAngularPostCSS

npm i patch-angular-postcss -D in webpack.config.js:

const { patchAngularPostCSS } = require("patch-angular-postcss");


module.exports = (config) => {
  patchAngularPostCSS({
    webpackConfig: config,
    addPlugins: [
      require("postcss-preset-env"),
      require("postcss-css-variables")
    ],
  });
  return config;
};

together with tailwind it will look like:

const { patchPostCSS } = require("@ngneat/tailwind");
const tailwindConfig = require("./tailwind.config.js");

module.exports = (config) => {
  patchPostCSS(config, tailwindConfig);
  patchAngularPostCSS({
    webpackConfig: config,
    addPlugins: [
      require("postcss-preset-env"),
      require("postcss-css-variables")
    ],
  });
  return config;
};

Just to mention I do not recommend trying to add tailwind using patchAngularPostCSS, as ngneat/tailwind have extra optimizations under the hood, so tailwind will work seamlessly with Angular.

@nartc I do think that even if we decide to not simplify postcss function, we should rename it to addTailwindCSS, as the name now is giving the wrong expectation from it.

[TryHardDood]

Sure. I support the idea of renaming the function to addTailwindCSS