easy-webpack / config-css

MIT License
0 stars 2 forks source link

Support for autoprefixer? #19

Open niieani opened 7 years ago

niieani commented 7 years ago

@mikeesouth commented on Mon Dec 12 2016

Hey,

Webpack 2 seems to have removed the postcss section and adding autoprefixer seems difficult. I tried adding it like this to my webpack.config.ts file (fetched from the aurelia skeleton-typescript-webpack):

....
var loaderOptionsPlugin = require('webpack/lib/LoaderOptionsPlugin');
var autoprefixer = require('autoprefixer');
....
plugins: [
      new loaderOptionsPlugin({
        options: {
          postcss: [
            autoprefixer()
          ]
        }
      })
    ],
...
  html(),
  css({ filename: 'styles.css', allChunks: true, sourceMap: false,
        additionalLoaders: ['postcss'] }),
  sass({ filename: 'styles.css', allChunks: true, sourceMap: false,
         additionalLoaders: ['postcss'] }),
  json(),
  fontAndImages(),
  globalBluebird(),
...

First I imported loaderOptionsPlugin and autoprefixer, then I loaded autoprefixer as a postcss option to loaderOptionsPlugin and finally I added additionaloaders (postcss) to my css and sass @easy-webpack modules.

This did not work. Any ideas? Or maybe some kind soul would like to write @easy-webpack/config-autoprefixer? :)

niieani commented 7 years ago

@mikeesouth I'll look into adding an option for the config-css/sass, etc.

What you've shown above should work. Not sure why it doesn't, can you provide a complete config? I'd recommend adding a test to the loaderOptionsPlugin though, limiting it to css and sass files.

mikeesouth commented 7 years ago

@niieani any progress here? I've tried adding a test to only css (I've removed sass to simplify the config) but it still doesn't work. When I run npm run build:prod I get this error:

    /*# sourceMappingURL=bootstrap.css.map */
     is not a PostCSS plugin
        at Processor.normalize (C:\lib\processor.es6:114:23)
        at new Processor (C:\lib\processor.es6:35:29)
        at Object.postcss (C:\lib\postcss.es6:34:12)

I have a forked skeleton-typescript-webpack and reproduced the error with minimal changes to the skeleton: https://github.com/mikeesouth/skeleton-navigation

niieani commented 7 years ago

Unfortunately no progress, I didn't have the time nor need to work on this. PRs are welcome though!