Autoprefixer not working with code in book

[ryanhamley]

I don't know if something has changed recently or if I'm making a very silly mistake, but I cannot get Autoprefixer working to save my life.

I'm using Node 6.9.2, Webpack 2.2.1, Autoprefixer 7.0.1, PostCSS 5.2.17 and PostCSS-Loader 2.0.1.

In webpack.parts.js:

exports.autoprefix = () => {
  console.log('autoprefix');
  return {
    loader: 'postcss-loader',
    options: {
      plugins: () => ([
        require('autoprefixer'),
      ]),
    },
  };
};

I modified the code from the book so I could log in the function to make sure it's being executed and it is. I had initially copied and pasted the code directly from the book and that did not work either.

In webpack.config.js:

const productionConfig = merge([
  parts.extractCSS({
    use: ['css-loader', parts.autoprefix()],
  }),
]);

My main.css:

body {
  background: cornsilk;
  display: flex;
}

Running npm run build works fine. There's no errors, the CLI output looks fine and the page loads as expected. But app.css in the build folder is exactly the same as main.css with no prefixes applied. I've tried with some other CSS properties such as display: grid and background: linear-gradient(...) which did not get prefixed either.

Any help would be appreciated.

[bebraw]

postcss-loader 2 was published a day ago to follow the new version of postcss. You could use the older versions I have at my demo for now.

I have to figure out whether this is a bug or a problem in my configuration (possible if they changed the configuration style somehow).

[bebraw]

I see, instead of require('autoprefixer'), looks like require('autoprefixer')() is needed now.

[ryanhamley]

Ah, wow, perfect timing on my part to end up with the new version of the loader. I tried just updating to require('autoprefixer')() but I got the same results as before. Notably, the style linting didn't work properly either since it's also using postcss-loader. But reverting to a 1.x version of postcss-loader fixed both the linting and autoprefixer. I'll work with that for now until I have time to look at the new loader more closely. Thanks for the help and for pointing me to the demo project code!

[bebraw]

No worries. I have to look into this in greater detail to see if it's a bug or what. The signature needs to be fixed but there could be something else going on. Thanks for opening the issue. 👍

[bebraw]

@ryanhamley Can you push a project to GitHub where linting fails for you? I upgraded the setup to the new scheme and it seems to be fine for me.