Webpack build fails after upgrade from postcss-cssnext 2.9.0 to 2.10.0

[mundizzle]

hello there. I tried upgrading from 2.9.0 t0 2.10.0 and now getting the error below when I do a Webpack build. I can't tell if this is a Webpack bug, cssnext bug, caniuse bug, or something else.

any ideas? thanks in advance

> npm run webpack


> mWeb2@1.0.0 webpack /Users/tandemseven/Github/Tandemseven/mWeb
> webpack --config "config/webpack.build.prod" --optimize-minimize --progress -p

/Users/tandemseven/Github/Tandemseven/mWeb/node_modules/postcss-cssnext/node_modules/caniuse-api/dist/index.js:69
    return data.stats[browser[0]] && data.stats[browser[0]][browser[1]] === "y";
               ^

TypeError: Cannot read property 'stats' of undefined
    at /Users/tandemseven/Github/Tandemseven/mWeb/node_modules/postcss-cssnext/node_modules/caniuse-api/dist/index.js:69:16
    at Array.every (native)
    at isSupported (/Users/tandemseven/Github/Tandemseven/mWeb/node_modules/postcss-cssnext/node_modules/caniuse-api/dist/index.js:68:6)
    at /Users/tandemseven/Github/Tandemseven/mWeb/node_modules/postcss-cssnext/lib/index.js:69:117
    at Array.forEach (native)
    at /Users/tandemseven/Github/Tandemseven/mWeb/node_modules/postcss-cssnext/lib/index.js:56:35
    at creator (/Users/tandemseven/Github/Tandemseven/mWeb/node_modules/postcss/lib/postcss.js:150:35)
    at Object.<anonymous> (/Users/tandemseven/Github/Tandemseven/mWeb/config/webpack.js:59:37)
    at Module._compile (module.js:571:32)
    at Object.Module._extensions..js (module.js:580:10)
    at Module.load (module.js:488:32)
    at tryModuleLoad (module.js:447:12)
    at Function.Module._load (module.js:439:3)
    at Module.require (module.js:498:17)
    at require (internal/module.js:20:19)
    at Object.<anonymous> (/Users/tandemseven/Github/Tandemseven/mWeb/config/webpack.build.prod.js:3:34)
    at Module._compile (module.js:571:32)
    at Object.Module._extensions..js (module.js:580:10)
    at Module.load (module.js:488:32)
    at tryModuleLoad (module.js:447:12)
    at Function.Module._load (module.js:439:3)
    at Module.require (module.js:498:17)

[MoOx]

Looks like a caniuse-api issue. Can you try upgrading this package if possible?

[mundizzle]

thanks for responding.

I don't have caniuse-api as a direct dependency of my project.

it's a dependency of postcss-cssnext - /Users/tandemseven/Github/Tandemseven/mWeb/node_modules/postcss-cssnext/node_modules/caniuse-api/dist/index.js

the version of caniuse-api which postcss-cssnext is using is "version": "1.5.3" which I believe is the latest version

[Shyam-Chen]

Same here with Rollup.

/Frontend-Starter-Kit/node_modules/caniuse-api/dist/index.js:69
    return data.stats[browser[0]] && data.stats[browser[0]][browser[1]] === "y";
               ^

[Vinnl]

So I ran into this too, and did some digging. The issue is not so much the version of caniuse-api (since the caret specified that that would be used with 2.9.0 as well), but rather the addition of colorHexAlpha: ["css-rrggbbaa"], in #345. Re-commenting that out removes the error for me.

I've submitted #358 to at least be able to release another version that successfully builds. The root cause of course still needs investigation. Unfortunately I'm not familiar enough with the code base at this time to be able to properly do that myself.

[Vinnl]

I actually did some more digging. The problem seems to be that, one way or another, version 1.0.30000590 of caniuse-db gets installed, which is not the latest version and does not contain an entry for the css-rrggbbaa feature. The odd thing is that the latest release of caniuse-api, which lists it as a dependency, has it pegged to version ^1.0.30000346 - which I interpret to mean that it should install the latest release, 1.0.30000636 - which does have data on css-rrggbbaa.

I'm not sure why that doesn't happen. Perhaps there's a different package locking caniuse-db to a lower version, and then Yarn (which I use) thinking that using that is fine too.

[Vinnl]

All right, I think I've figured it out, with a proper fix this time (sorry for the comment spam). The reason 1.0.30000590 was installed was, I think, simply because it already was installed, so in Yarn's view it was good enough to just leave that be.

I think it can be forced to install at least the correct version by specifying it as a peerDependency. Since I don't have that much experience with publishing libraries I don't know how to test this, though, so I can't be 100% sure.

Anyway, I've submitted that as #359.

A workaround for now is to specify the newer version of caniuse-db in yarn.lock:

  version "1.0.30000636"
  resolved "https://registry.yarnpkg.com/caniuse-db/-/caniuse-db-1.0.30000636.tgz#08230e9dd26632193f29c9d935185c6f6f9fd9ef"

[thisconnect]

@Vinnl thanks man! had the same issue using postcss + postcss-cssnext directly, but only on travis with cached node_modules dir. deleting the node_modules caches on travis fixed it I believe ... does that make sense?

[Vinnl]

@thisconnect Yes, that makes sense. node_modules still contained the old version of caniuse-db, which for all it knew satisfied the requirements (even though it didn't). Deleting that made it fetch the newest version, which also satisfied all known requirements - and also the actual requirements :)

[ZeroCho]

I also experience this issue when I use a CI tool. I use Circle CI and whenever it tests my code, it alerts cannot read property 'stats' of undefined and then fails. I guess that CI tool cannot determine the correct version of caniuse-db package to use.

[OrenSchwartz]

with correspondence to @Vinnl 's answer, had the same issue, and the same fix worked for npm shrinkwrap.

[piotr-cz]

I've deleted directories caniuse-api and caniuse-db, and run npm install which fixed the error.
Thanks @Vinnl

[KyleAMathews]

Upgrading Gatsby to 2.10.0 broke webpack builds. Pinning to 2.9.0 until this is fixed.

[Vinnl]

#369 incorporated the same fix as #359, so that should solve this issue.

[Semigradsky]

Can you try with 2.11.0 ?

[krazik]

npm WARN postcss-cssnext@2.11.0 requires a peer of caniuse-db@^1.0.30000652 but none was installed. not working for me

[krazik]

nevermind, I saw a suggestion to clear cache. I had to remove my node_modules dir locally and clear cache in CircleCI to get the build to go through.

[thejohnnybot]

having the same issue on 2.11

[MoOx]

You need to respect the peer dep yourself. 2.11 specifiy the correct deps.

[Shyam-Chen]

@datajohnny Try npm i caniuse-db -D or yarn add caniuse-db -D

[Vinnl]

This issue is indeed happening again with 2.11.0 (see #381). I've submitted #380 to fix this, but until then, either clear your node_modules or, if you're using Yarn, modify your yarn.lock to use at least 1.0.30000670 of caniuse-db as described in this comment.

[pixelass]

Also reported here: Fyrd/caniuse#3441