Webpacker: Remove Post CSS

[rctneil]

How can I remove PostCSS? My app does not require it but it's causing errors due to my use of CSS Custom Properties.

Thanks

[rctneil]

Any ideas? I really need to remove it but am unsure how to do so.

[haffla]

A quick and dirty way to do this would be the following in config/webpacker/environment.js

environment.loaders.forEach(element => {
  environment.loaders.get(element.key).use = environment.loaders.get(element.key).use.filter(rule => rule.loader !== 'postcss-loader')
});

[foucist]

let keys = ['css', 'sass', 'moduleCss','moduleSass']

keys.map(function(key) {
  let thing = environment.loaders.get(key)
  let index = environment.loaders.get(key).use.findIndex(el => el.loader === 'postcss-loader');

  thing.use[index].options = {
    plugins: (loader) => [
      require('postcss-cssnext')({
        features: {
          customProperties: {
            warnings: false
          }
        }
      })
    ],
    modules: true,
    sourceMap: true,
    localIdentName: '[name]__[local]___[hash:base64:5]',
  }

})

Another dirty solution that I came up with for turning off the warnings, since I use bulma.

[gkatsanos]

for the interwebs wonderer, you can nuke built in configs with :

environment.loaders.delete('sass')
environment.loaders.delete('moduleSass')
environment.loaders.delete('moduleCss')
environment.loaders.delete('css') // this is the problematic one usually ! 

show some <3