Browserslist error

[razvan-soare]

Hello, i just used 'npx create-react-app project-name' and when im starting my project im getting this error:

/src/index.css (./node_modules/css-loader/dist/cjs.js??ref--6-oneOf-3-1!./node_modules/postcss-loader/src??postcss!./src/index.css)
BrowserslistError: Unknown browser query android all. Maybe you are using old Browserslist or made typo in query.
at Array.reduce ()
at Array.some ()
at Array.filter ()

Npm -v : 6.9.0
Node -v : v10.16.0

[akshayakrsh]

Same issue for the same versions of node and npm

[pirey]

Same issue with me

[bhavikji]

Same issue for

Npm -v : 6.9.0
Node -v : v11.2.0

[epicbytes]

yep - same issue. what we gonna do?

[ckristhoff]

Same here.
Node 11.6.0
npm 6.9.0

[epicbytes]

may be we just downgrade version of browserlist to 4.6.1?
in 4.6.2 they are fixed android queries
() Fix last x version and similar queries for Android (by Tony Ross).

[bhavikji]

@epicbytes don't we need to eject CRA for that?

[epicbytes]

@epicbytes don't we need to eject CRA for that?

i dont know in this time, its just an idea)

[fantasticit]

same issue

[SunJianMing]

Same issue

[akshayakrsh]

If you want to pin browserslist version, pin it to 4.6.0.
4.6.2 = 4.6.1 + Readme changes
4.6.1 is the faulty one and was release 20days ago

[masak]

We're having the same issue here. Halp. 😞
Node v11.1.0
npm 6.1.0

[fireswork]

same issue 🙋

[ckristhoff]

If you want to pin browserslist version, pin it to 4.6.0.
4.6.2 = 4.6.1 + Readme changes
4.6.1 is the faulty one and was release 20days ago

Browserslist 4.6.0 still raises same error to me.

[b4h0-c4t]

Same issue for :
npm ver. 6.9.0
node ver. 12.4.0

[axlwang1976]

Same issue for :
npm ver. 6.9.0
node ver. 10.16.0

[yb]

Same issue for :
npm ver. 6.9.0
node ver. 10.14.1

[ulsha]

Same issue for :
npm ver. 6.9.0
node ver. 10.14.1

[anthonypenna]

Same issue:

node v 11.6.0
npm  v 6.5.0

[qwertybot]

Same issue:

node v 10.16.0
npm v 6.9.0

[belio39]

Same issue:
./src/index.css (./node_modules/css-loader??ref--6-oneOf-3-1!./node_modules/postcss-loader/src??postcss!./src/index.css)
BrowserslistError: Unknown browser query android all. Maybe you are using old Browserslist or made typo in query.
at Array.reduce ()
at Array.some ()
at Array.filter ()

[rinkisingh8181]

Same issue

node v v10.13.0
npm v 6.4.1

[VincentLeonrdo]

Same issue
npm 6.9.0
node v10.15.3

[jfchico]

Same here
npm 6.4.1
node 8.12.0

[mohammadsobhy]

same here
./src/index.css (./node_modules/react-scripts/node_modules/css-loader/dist/cjs.js??ref--6-oneOf-3-1!./node_modules/postcss-loader/src??postcss!./src/index.css)
BrowserslistError: Unknown browser query android all. Maybe you are using old Browserslist or made typo in query.
at Array.reduce ()
at Array.some ()
at Array.filter ()

[sfatihk]

browserslist/browserslist#382 (comment)

[alexandrsmirnov93]

Same issue
npm 5.6.0
node 8.11.4

[hwiVeloper]

same issue
node -v : v10.13.0
yarn -v : 1.16.0

[dev-zetta]

Same issue...

[hileix]

Same issue.
node -v: 8.11.4
yarn -v: 1.16.0

[liSong5713]

how do fix this issue?

[jaywcjlove]

@liSong5713 Temporary solution:

npm i browserslist@4.6.2
npm i caniuse-lite@1.0.30000974

[ycjcl868]

temporary solution:

// package.json

  "resolutions": {
    "browserslist": "4.6.2",
    "caniuse-lite": "1.0.30000974"
  },

maybe you can use umijs, it is not affected.

[ghost]

This looks like a repeat of what the angular team ran into some time ago. Came to report left with a solution. Thank you! @jaywcjlove @4Eric

[jonathantneal]

It looks like caniuse or caniuse-lite may have published a potentially breaking change that rolled into postcss-preset-env, which then rolled into browserslist and threw this error or warning.

How it worked: More or less, caniuse stats are provided as an object of features, like { "css-all": {}, "css-any-link": {} }. Within each feature, stats are provided as an object of browsers, like { "android": {}, "edge": {} }. Within each browser, stats are provided as an object of versions or version ranges, like { 4.1": "n", "4.2-4.3": "n" }.

For example, one tree of features might look like { "css-all": { "android": { "4.1": "n", "4.2-4.3": "n" } } }.

What changed: Within the android browser object of versions, stats now provide a simplified "all" value.

This means one tree of features might look like { "css-all": { "android": { "all": "n" } } }.

That is how the android all query ends up getting generated, which browserslist does not support.

[mastoj]

How i can update Browserlist inside create-react-app?

yarn upgrade or npm update

Didn't help with update.

[umyar]

How i can update Browserlist inside create-react-app?

yarn upgrade or npm update

Didn't help with update.

Try it stuff:

// package.json

"devDependencies": {
    "browserslist": "4.6.2"
  },
"resolutions": {
    "browserslist": "4.6.2",
    "caniuse-lite": "1.0.30000974"
  },

There is some help.

[mastoj]

How i can update Browserlist inside create-react-app?

yarn upgrade or npm update

Didn't help with update.

Try it stuff:

// package.json

"devDependencies": {
    "browserslist": "4.6.2"
  },
"resolutions": {
    "browserslist": "4.6.2",
    "caniuse-lite": "1.0.30000974"
  },

There is some help.

@umyar, that didn't help. Adding that actuall fails my build with the following message:

./src/App.css
BrowserslistError: Unknown browser query android all. Maybe you are using old Browserslist or made typo in query.
at Array.reduce ()
at Array.some ()
at Array.filter ()

npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! explorer@0.1.0 build: react-scripts build
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the explorer@0.1.0 build script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR! /Users/tomasjansson/.npm/_logs/2019-06-20T12_55_59_151Z-debug.log

[nicdex]

This guy has the fix browserslist/browserslist#382 (comment). Just tried and it works.

[derek-adair]

OH BOY! what a dumpster fire. This broke my 2.1.8 build. Can't get those 8 hours back....

I 100% understand that the blame here is distributed, but I still am considering ejecting and/or migrating away from react-scripts entirely. I can't help but wonder which one of the dependencies will break next. There are over 50 direct dependencies in package.json when i eject a fresh project, and node_modules has around 1000 folders in it.

Is this REALLY the way to use react?

Also the only thing that worked for me was settings browserslist:[] in package.json as @anhquande has mentioned.

[arifulbgt4]

temporary solution:

// package.json

  "resolutions": {
    "browserslist": "4.6.2",
    "caniuse-lite": "1.0.30000974"
  },

maybe you can use umijs, it is not affected.

don't work

[zechau]

temporary solution:

// package.json

  "resolutions": {
    "browserslist": "4.6.2",
    "caniuse-lite": "1.0.30000974"
  },

maybe you can use umijs, it is not affected.

don't work

remove browserslist item, only set caniuse-lite, it worked for me. plus, you should use yarn or install npm-force-resolutions.

[ycjcl868]

@zechau you can use yarn install, it's ok. resolutions

[zechau]

@ycjcl868 gotcha.

[ghost]

Any level of testing should have caught this, that is the contract cost of using dependancies. I hate to ask or look since I know what I'm getting isn't what I'll actually use when I care about the content I'm making, but do you need help developing better tests? This project is a nice relief for dealing with rolling changes in this bloated ecosystem. I'm confident if it needs to happen the community will come together to make sure this doesn't happen again. It could have been any subdep changes that didn't crash getting into your npm release.

[timurmamedov]

@ai @jonathantneal builds seem to be succeeding now, since the latest update to caniuse-lite from 5 hours ago. Thank you.

[jonathantneal]

@timurmamedov, yes, the all version appears to be removed in caniuse-db@1.0.30000976, which has been merged into caniuse-lite@1.0.30000976.

I used this rudimentary test to compare v1.0.30000975 and v1.0.30000976:

// present in 1.0.30000975, removed in 1.0.30000976
caniuse.feature(caniuse.features['prefers-color-scheme']).stats.android.all

Looking at the most recent commits to caniuse-lite, it appears this change was most likely made within caniuse-db, and not patched in caniuse-lite. This is great news for all projects affected by the all change to caniuse-db, including PostCSS Preset Env. 🎉

@etisdew, if I managed caniuse, which merely exports a collection of function-less JSON files, I might not be prepared to test for every way other projects have chosen to use my files. If you think more tests are needed, you must produce a sufficient JSON schema and submit the PR to caniuse-db — I believe that is the contract cost of complaining about open source. 😉

[kennethrivera]

@ai @jonathantneal builds seem to be succeeding now, since the latest update to caniuse-lite from 5 hours ago. Thank you.

I just tried it on my projects and it seems the issue is resolved.

[ghost]

@jonathantneal I only feel empathy for the situation in which another repository is able to affect its downstream users. From a learning perspective what is the best way of managing and remediating dependancys and the possibility of dependency divergence? Rollback and lock until stable? Find/build alternatives?

My major concern is malicious injection through strategic compromise and the dangers of rolling dependencies. I know that in any sizable form they would be obvious and found in review but on the state of the culture, the idea of manually disabling an execution context from human input grows harder and harder in the context of an automated pipeline not using strict version semantics and open source suffering from non-viable donation models to give the time and attention where it deserves to be. Keep fighting the good fight, but I would be interested to learn more about how to handle these issues, isolating ones own project from them without going full hermit.

[ai]

@etisdew we already discussing solution in postcss-preset-env repo. This repo is a wrong place for issue and discussing.

[derek-adair]

@ai and all the other devs in create-react-app. THANK YOUUUU. I REALLY dont wanna eject, nor migrate, nor deal w/ the crap ya'll deal with.

This also highlights the absurdity that we deal w/ in the first place. The dependency-heavy-environment that we navigate is a result of the browser devs (read as Google/Firefox/Apple as orgs, NOT the engineers) lack of standards and coherency.

As endusers its super easy to place blame, CRA, or browserslists, or postcss-preset-env. The reality is that NONE of these would have to exist if the browser wasn't a giant flaming turd to develop on.

Thank you for propping up our shit env with your tools.

---

Now, what can we do to help avoid this?

EDIT: this=mitigating upstream dependencies breaking builds.

It TERRIFIES me that 1/900+ dependencies can potentially BREAK a production build.

[derek-adair]

Question is definitely off topic... I am not even talking about this browserslists fiasco.

As a user of CRA, what kind of confidence can I have in this going forward that this wont just randomly break?

[ghost]

I apologize for OT and discussion, I have to second the comment thanking you and all developers in the pipeline we have to manage everyday. You save me hours and headaches. Open source is a beautiful thing aswell. Issue seems to be largely closed yes?

@derek-adair
We can certainly have confidence that anything wrong will incur the recognition required to solve the issue with our cumulative knowledge and efforts. Its the smaller packages we sit on the shoulders of that need us most though they wont get our attention until its called for and something is already wrong. I guess the answer is some sense of community.

[ai]

Yeap, this issue can be closed here.

We in separated issue are finding solution to prevent problems on similar case in the future.

[ianschmitz]

As a user of CRA, what kind of confidence can I have in this going forward that this wont just randomly break?

That's what the package lock file prevents.

Closing this issue for now as it appears to be resolved. Will leave pinned for a couple days in case anyone is still running into this issue.

[derek-adair]

That's what the package lock file prevents.

This broke a stable project on CRA 2.1.8. With said lock file, I was getting a warning saying to update caniuse-lite and browserslist. I did not update or change any deps; I woke up to builds failing.

I'd be happy to provide yarn.lock if useful.

[bugzpodder]

@derek-adair please file a new issue with commands your build ran and errors you saw. Also results to "yarn why caniuse-lite"