create-react-app "Failed to compile" on start up

Question

I am getting the following error when using npm start to open create-react-app. I'm new to React and I have had no problems the past few days doing the command line to make a new app.

I have tried npx start, npm start and installed npm again for the updated version.

Failed to compile
./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 (<anonymous>)
    at Array.some (<anonymous>)
    at Array.filter (<anonymous>)

That message is telling your that your CSS is failing to compile. Take a look at your index.css and see what is wrong with it. — dwjohnston, Jun 18 '19 at 08:16
I just installed a fresh create-react-app and I am getting the same error.. — Orhan, Jun 18 '19 at 08:24

Orhan · Accepted Answer · 2019-06-18T09:52:25.010

35

It is a new bug in BrowserList.

There are new reports on this both in create-react-app: https://github.com/facebook/create-react-app/issues/7239

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

As suggested by John Forbes below the workaround given on the github issue is to change the browserslist entry in package.json to

"browserslist": []

This will build and run the project.

edited Jun 18 '19 at 09:52

answered Jun 18 '19 at 08:32

Orhan

1,395
13
12

6

The workaround given on the github issue is to change the browserslist entry in package.json to ```"browserslist": []``` – John Forbes Jun 18 '19 at 08:48

score 2 · Answer 2 · answered Jun 19 '19 at 08:55

2

As proper temporal solution till bug fixing: add to package.json this:

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

answered Jun 19 '19 at 08:55

AxaZol

21
3

is "resolutions" supported by npm ? or just yarn? – gaurav5430 Jun 23 '19 at 06:09

score 1 · Answer 3 · answered Jun 18 '19 at 08:41

1

At the moment you can try this and wait for further fix

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

answered Jun 18 '19 at 08:41

Lâm Nguyễn

23
3

score 1 · Answer 4 · answered Jun 24 '19 at 08:13

I can confirm that forcing a yarn resolution for caniuse-lite@1.0.30000974 fixes the error. It must be an issue with the latest caniuse-lite@1.0.30000975 release.

temporary solution:

In package.json add

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

This method solved my problem.

score 1 · Answer 5 · edited Jun 13 '22 at 00:40

1

I tried updating the browserlist and then did this.

Delete this part in package.json

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

And run npm start
It will ask for yes or no, give yes

Solved!

edited Jun 13 '22 at 00:40

Sagar Darekar

982
9
14

answered Jun 10 '22 at 19:43

front_end

29
6

create-react-app "Failed to compile" on start up

5 Answers5