Create-react-app: 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]

https://github.com/browserslist/browserslist/issues/382#issuecomment-502991170

[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

[circlezero]

same issue
node -v: v10.15.0
npm -v: 6.4.1

[jacob-j]

Same issue
Node: 11.7.0
npm: 6.5.0

[alexaf2000]

Same issue on nuxt right now

same in Nuxtjs
create-nuxt-app

[tiavina-mika]

same issue right now

[pijontwo1]

Same issue
Node: 10.16.0
npm: 6.9.0

[xtabbas]

Is the world falling apart? 😅

[gurenovich]

node v10.15.3
npm 6.9.0

[rinkisingh8181]

BTW what caused this? Does anyone has the clue?

[tiavina-mika]

has someone hacked the package repo? :o

[dragos199993]

same issue:
node: 10.12.19
npm: 5.6.0

[asiainfoliwei]

Same issue
node: 10.12.19
npm: 5.6.0

why?

[alexaf2000]

When a hacker breaks all the development community in the world hahaha

[vitaly-shaposhnik]

Same issue
Node: 8.12.0
Npm: 6.4.1

[arai03]

same in Nuxtjs
create-nuxt-app
npm run dev
help

 ERROR  Unknown browser query android all. Maybe you are using old Browserslist or made typo in query.

  at unknownQuery (node_modules/browserslist/index.js:204:10)
  at node_modules/browserslist/index.js:296:11

[kirjai]

hate to be "that guy", but commenting "Same issue" isn't really productive, and just pollutes the issue for whoever's looking at it. please reconsider

[iamcombo]

I'm here looking for solution not for comment same issue :(

[Stdev17]

I'm having same issue with
Node: v11.15.0
npm: v6.7.0

[Cinezaster]

Same issue with
Node V10.9.0
Npm V6.9.0

[chahidarid]

Anyone found a workaround this issue ?

[wbkboyer]

I've encountered the issue:

Failed to compile.

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

on Windows 10 x64:

>node -v
v12.4.0

>npm -v
6.9.0

EDIT: This is my browserslist entry in package.json:

  "browserslist": [
    ">0.2%",
    "not dead",
    "not ie <= 11",
    "not op_mini all"
  ],

EDIT2: When I changed browserslist:

  "browserslist": {
    "production": [
        ">0.2%",
        "not dead",
        "not ie <= 11",
        "not op_mini all"
    ],
    "development": []
  },

I was able to run npm start. Thanks, @NaNdaWteK !

[mehul1011]

same issue

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: 6.9.0
node: 10.16.0
issue arising during: npm start (starting live server for creating react app)

[NaNdaWteK]

There isn't a solution, but if you want to continue developing, remove development browserlist items in package.json works for me

"browserslist": {
    "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
    "development": [  
    ]
  }

[wujr5]

Same issue on macOs 10.14.5

node: 8.9.4, npm 5.6.0

[AntoineSinety]

Same issue :/

[marjoforcado]

Same issue
Mac OS 10.14.5
node 8.11.3
npm 6.2.0

[FinalAngel]

pin "caniuse-lite": "1.0.30000974" in your package.json

they released a new version 2 hours ago:
https://www.npmjs.com/package/caniuse-lite

[Pradeep-DCPL]

Same Issue

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 ()

[mohammadsobhy]

the great thing here is the same issue :D :dancer:

[lemondreamtobe]

same issue BrowserslistError: Unknown browser queryandroid all. Maybe you are using old Browserslist or made typo in query. at Array.reduce (<anonymous>) at Array.some (<anonymous>) at Array.filter (<anonymous>) at new Promise (<anonymous>)

[eoikonomou]

removing all options from browserslist.production does the trick. A simple workaround until it is properly solved

[SimonVerhoek]

There isn't a solution, but if you want to continue developing, remove development browserlist items in package.json works for me

"browserslist": {
    "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
    "development": [  
    ]
  }

Firefox seems to be the faulty one. It will still start when leaving chrome and safari there

[carpacciao]

On the left is the package.lock.json who was working before, on the right the new one.
There's only these differences.

[herorelative]

Different issue now!

./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 ()

[wujr5]

There isn't a solution, but if you want to continue developing, remove development browserlist items in package.json works for me

"browserslist": {
    "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
    "development": [  
    ]
  }

@NaNdaWteK It worked for me.

[maggot99999]

same issue here. Deleted import './index.css' from index.js and started to work. But this is not a solution.

[radiovisual]

Similar to @carpacciao's diff, I also see version differences in this package:

[lamnguyencse17]

There isn't a solution, but if you want to continue developing, remove development browserlist items in package.json works for me

"browserslist": {
    "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
    "development": [  
    ]
  }

This will work for now I believe

[dragos199993]

the solution will be to not use 30000975 caniuse-lite version and simply keep an older package-lock.json to restrict it to 973 or 974.

[SimonVerhoek]

Firefox seems to be the faulty one. It will still start when leaving chrome and safari there

Not sure if it's going to help anyone, but just wanted to note that after starting once successfully you seem to be able to actually put firefox back as well, and it will keep on starting successfully.

[mohammadsobhy]

delete these lines in the package json file
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version",
"Android >= 4"
an its worked

[ckristhoff]

the solution will be to not use 30000975 caniuse-lite version and simply keep an older package-lock.json to restrict it to 973 or 974.

pin "caniuse-lite": "1.0.30000974" in your package.json

they released a new version 2 hours ago:
https://www.npmjs.com/package/caniuse-lite

It works for me. Better solution for now.

[arai03]

temporary solution

package.json
"browserslist": [],

[sfatihk]

pin "caniuse-lite": "1.0.30000974" in your package.json

they released a new version 2 hours ago:
https://www.npmjs.com/package/caniuse-lite

  "dependencies": {
    "react": "^16.8.6",

     ...

    "caniuse-lite": "1.0.30000974"
  },

temporary solution, but its work

[haideritx]

pin "caniuse-lite": "1.0.30000974" in your package.json

they released a new version 2 hours ago:
https://www.npmjs.com/package/caniuse-lite

Installed, it but did not work for me.?
i am getting same error for android all when i run npm run dev

[josephnvn]

temporary solution

package.json
"browserslist": [],

This works!

[saurabhnemade]

temporary solution

package.json
"browserslist": [],

This works!!!

[haztares]

temporary solution

package.json
"browserslist": [],

yeah, I tried and worked

[lakylekidd]

There isn't a solution, but if you want to continue developing, remove development browserlist items in package.json works for me

"browserslist": {
    "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
    "development": [  
    ]
  }

@NaNdaWteK It worked for me.

Yes, worked also for me too!

[stickandstone]

temporary solution

package.json
"browserslist": [],

npm ERR! JSON.parse Failed to parse json

does not work for me hmm

[Merkur39]

temporary solution
package.json
"browserslist": [],

npm ERR! JSON.parse Failed to parse json

does not work for me hmm

Delete comma ;)

[JohnLyonJunior]

temporary solution
package.json
"browserslist": [],

npm ERR! JSON.parse Failed to parse json

does not work for me hmm

yaaas, remove the comma at the end

[mohsenSy]

Hi I just removed

"last 1 chrome version",
      "last 1 firefox version",
      "last 1 safari version"

from browsersList development and it worked, Somebody know the source of this problem?

[steve-gao]

At the moment you can try this and wait for further fix
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
]
}

[haideritx]

temporary solution
package.json
"browserslist": [],

This works!

Thankyou. worked.

[prsamy]

There isn't a solution, but if you want to continue developing, remove development browserlist items in package.json works for me

"browserslist": {
    "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
    "development": [  
    ]
  }

Same issue and the workarond fix works good. Thanks!

[stickandstone]

Hi I just removed

"last 1 chrome version",
      "last 1 firefox version",
      "last 1 safari version"

from browsersList development and it worked, Somebody know the source of this problem?

Yep it's worked! Thanks!

[sarpere]

"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
]
}
Update to your package.json . it worked for me as well.

[Saint2Laurent]

Sadly I can't get that working, I've removed everything from both the development and and production array but Im still getting the same error, pretty odd since it gets to work for nearly everyone.

[shaiksha2195]

"browserslist": []

This worked like a charm for me.

[phuhl]

the solution will be to not use 30000975 caniuse-lite version and simply keep an older package-lock.json to restrict it to 973 or 974.

For those of you using yarn, you need to modify the yarn.lock file to not include the 975 version. You can use a block like this:

[email protected], caniuse-lite@^1.0.0, caniuse-lite@^1.0.30000929, caniuse-lite@^1.0.30000939, caniuse-lite@^1.0.30000955, caniuse-lite@^1.0.30000971, caniuse-lite@^1.0.30000974, caniuse-lite@^1.0.30000884, caniuse-lite@^1.0.30000887:
  version "1.0.30000974"
  resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30000974.tgz#b7afe14ee004e97ce6dc73e3f878290a12928ad8"
  integrity sha512-xc3rkNS/Zc3CmpMKuczWEdY2sZgx09BkAxfvkxlAEBTqcMHeL8QnPqhKse+5sRTi3nrw2pJwToD2WvKn1Uhvww==

to pin it to 974 and also remove the block, referencing to 975.

[timoken]

Somebody know the source of this problem?

Don't see an issue here https://github.com/browserslist/browserslist/commits/master
Must be something else 🤔

[irawatigole]

There isn't a solution, but if you want to continue developing, remove development browserlist items in package.json works for me

"browserslist": {
    "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
    "development": [  
    ]
  }

Same issue and the workarond fix works good. Thanks!

Worked for me, thanks

[mariakhanusia]

temporary solution
package.json
"browserslist": [],

This works!

Thankyou. worked.

This worked perfectly! Thank you so much

[afeiluo]

"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
]
}
Update to your package.json . it worked for me as well.

worked for me

[danielnagel]

Same Issue here

Windows 10 Version 1809 (Build 17763.557)
node v11.10.0
npm 6.7.0

Following Solution worked 🚀

• Add caniuse-lite to your package.json
• npm i

"dependencies": {
    "react": "^16.8.6",
    ...
    "caniuse-lite": "1.0.30000974"
  }

[albertleigh]

maybe resolutions better for the temp quick fix

 "resolutions": {
    "caniuse-lite": "1.0.30000974"
  }

[teer823]

"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
]
}
Update to your package.json . it worked for me as well.

Work for me, Thanks!

[ttotal]

maybe resolutions better for the temp quick fix

 "resolutions": {
    "caniuse-lite": "1.0.30000974"
  }

works in yarn 😘

[Saint2Laurent]

For those of you who can't seem to have much luck with the solutions provided try aborting npm run and executing it again.

[rakeshpatil489]

temporary solution

package.json
"browserslist": [],

[guillermo]

Rolling back to [email protected] works perfectly.

I though yarn add [email protected] --exact will force the version. But doesn't.

So I did what @phuhl said. Edit yarn.lock for the line for caniuse-lite that reference 975, and manually update the version, resolved and integrity lines. Respecting the first line. Then yarn install and it started working again.

[email protected], caniuse-lite@^1.0.0, caniuse-lite@^1.0.30000918, caniuse-lite@^1.0.30000929, caniuse-lite@^1.0.30000955, caniuse-lite@^1.0.30000971, caniuse-lite@^1.0.30000974: version "1.0.30000974" resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30000974.tgz#b7afe14ee004e97ce6dc73e3f878290a12928ad8" integrity sha512-xc3rkNS/Zc3CmpMKuczWEdY2sZgx09BkAxfvkxlAEBTqcMHeL8QnPqhKse+5sRTi3nrw2pJwToD2WvKn1Uhvww==

[softlight0629]

maybe resolutions better for the temp quick fix

 "resolutions": {
    "caniuse-lite": "1.0.30000974"
  }

Work for me, Thanks!

[aksharmajune87]

I am also facing the same issue,

./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.

[timoken]

Looks like this is the problem. There has been a commit in caniuse-lite 3 hours ago: https://github.com/ben-eb/caniuse-lite/commits/master

Issue: https://github.com/ben-eb/caniuse-lite/issues/27

[mehul1011]

here https://pasteboard.co/IjXHz77.png is the package.json file just update yours to this you will be all set to go temporarily after this do npm start.

[arai03]

check here
https://github.com/browserslist/browserslist/issues/382

[danielnagel]

Setting up a typescript project with

create-react-app --typescript project

does not produce this error 🤔

[obinosteve]

maybe resolutions better for the temp quick fix

 "resolutions": {
    "caniuse-lite": "1.0.30000974"
  }

Work for me, Thanks!

maybe resolutions better for the temp quick fix

 "resolutions": {
    "caniuse-lite": "1.0.30000974"
  }

Worked like charm

[ai]

We made a dirty fix in Browserslist 4.6.3 to fix the problem:

https://twitter.com/Browserslist/status/1140911400304467968

[NaNdaWteK]

The problem is solved in new react apps at this moment

[hbddn92]

The problem is fixed :)

[lalosh]

problem solve after install browserslist

 npm i [email protected]

[Creator-360]

hello, after the fix my react project run but while compiling I got this:

[ai]

hello, after the fix my react project run but while compiling I got this:

You will see this warning until we will not have the real fix in postcss-preset-env

[razvan-soare]

@ai Thank you so much for the quick "dirty" fix. Really appreciate it

[Creator-360]

@ai please tell us when the problem is solve
Thanks for the help

[ai]

@Creator-360 subscribe to https://twitter.com/Browserslist for recent updates

[thaivb]

temporary fix, change
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],

to
"browserslist": {
"production": [

],

[ai]

Do not change browserslist: []. It will remove all prefixes and polyfills.

Just update Browserslist. It has dirty fix.

[umyar]

Just update Browserslist. It has dirty fix.

How i can update Browserlist inside create-react-app? i have just installed latest Browserslist in devDependencies, but it doesn't help me.

[anhquande]

same issue:
on yarn v1.16.0
clear the browserlist is the temporary solution.
"browserslist": { "production": [ ], "development": [ ] } }

[anthony0030]

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

[tourniquet]

"browserslist": {
    "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
    "development": [
      "last 1 chrome version",
      "last 1 firefox version",
      "last 1 safari version"
    ]
  }

This solution worked for me

[ai]

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

yarn upgrade or npm update

[molszanski]

it seems like caniuse-lite has unpublished the bad version. rm -rf node_modules and reinstall deps.
Update: sorry, got local cached response

[tarreislam]

it seems like caniuse-lite has unpublished the bad version. rm -rf node_modules and reinstall deps

nope

[bugzpodder]

I think the issue is now fixed:

npm cache clean --force
rm -rf node_modules 
rm package-lock.json && npm install

or

yarn cache clean
rm -rf node_modules
rm yarn.lock && yarn

would do.

[march08]

I think the issue is now fixed:

npm cache clean --force
rm -rf node_modules 
rm package-lock.json && npm install

or

yarn cache clean
rm -rf node_modules
rm yarn.lock && yarn

would do.

no it's not, here: https://www.npmjs.com/package/caniuse-lite, version 1.0.30000975 is still active (which is also causing the problem)

[mmiszy]

I did

npm cache clean --force
rm -rf node_modules 
rm package-lock.json && npm install

and yet the problem remains :(

[bugzpodder]

march08 is right, caniuse-lite 1.0.30000975 was removed on https://github.com/ben-eb/caniuse-lite/releases but it is still available on npm. So we are still waiting for downstream patches to happen.

[4Eric]

I tried...

1. npm cache clean --force
2. rm -rf package-lock.json
3. npm install [email protected]

and the error is gone.....!!!!

[timurmamedov]

@ai this is affecting our production release cycles since builds break and can't complete with Netlify. Would it be possible to revert introduced breaking change and try to find a fix it in isolation?

A temporary fix is only good if you are serving an SSR app, but static builds can't conclude.

Also, I may be wrong but other suggested fixes are non-deterministic as far as I can tell and don't work for everyone's environment or every time.

Thanks for your effort in investigating this

[ai]

@timurmamedov nobody did a breaking change. We had an error in postcss-preset-env browsers generation. By accident this error didn't showed before. New Can I Use update just contained new data. Unfortunately with this new data that old issues generated wrong browsers list (with never existed android all). The browsers list is still broken because of this issue. We should fix this issue somewhere in postcss-preset-env.

Latest Browserslist is just a dirty fix. We just ignore broken android all browser. But it means that Autoprefixer will miss correct prefixes for Android. To mark that browsers list is still incorrect we print warning.

We need to wait when @jonathantneal will fix the problem. If you want to make it faster, send him some love. CSS and JS communities everyday use his work and we own him a lot of love and support.

[timurmamedov]

I see, thanks for clarification Andrey. I'll see if we can have a look as well

[liSong5713]

how do fix this issue?

[jaywcjlove]

@liSong5713 Temporary solution:

npm i [email protected]
npm i [email protected]

[ycjcl868]

temporary solution:

// package.json

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

maybe you can use umijs, it is not affected.

[etisdew]

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! [email protected] build: react-scripts build
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the [email protected] 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 https://github.com/browserslist/browserslist/issues/382#issuecomment-503182000. 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.

[etisdew]

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 [email protected], which has been merged into [email protected].

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.

[etisdew]

@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?

[etisdew]

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"