Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

BrowserslistError: Unknown browser query `dead` in React/Express App

When I run 'npm start', the app starts just fine but 'npm run build' gives me the following message in the terminal:

> [email protected] build /Users/*******/mern-workout/client
> react-scripts build

Creating an optimized production build...
Failed to compile.

./src/Components/UI/Spinner/Spinner.module.css
Module build failed: BrowserslistError: Unknown browser query `dead`
    at Array.forEach (<anonymous>)


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/*******/.npm/_logs/2018-10-22T23_21_04_691Z-debug.log

I've searched but, the only solutions seem to be for people using Angular who are having some issue with their Bootstrap version. I am not using Bootstrap in my app.

I tried removing "not dead" from the browserslist array just to see what would happen and i got this:

Creating an optimized production build...
Failed to compile.

Failed to minify the code from this file: 

    ./node_modules/query-string/index.js:8 

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/******/.npm/_logs/2018-10-22T23_41_55_488Z-debug.log

Here is my package.json file:

 {
  "name": "workout_tracker",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "axios": "^0.18.0",
    "browserslist": "^4.3.1",
    "cssnano": "^4.1.7",
    "firebase": "^5.3.0",
    "jw-paginate": "^1.0.2",
    "jw-react-pagination": "^1.0.7",
    "normalize.css": "^8.0.0",
    "query-string": "^6.2.0",
    "random-id": "0.0.2",
    "react": "^16.5.2",
    "react-dom": "^16.5.2",
    "react-headroom": "^2.2.2",
    "react-icons-kit": "^1.1.6",
    "react-redux": "^5.0.7",
    "react-router-dom": "^4.3.1",
    "react-scripts-cssmodules": "^1.1.10",
    "react-swipe-to-delete-component": "^0.3.4",
    "react-swipeout": "^1.1.1",
    "redux": "^4.0.0",
    "redux-thunk": "^2.3.0"
  },
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test --env=jsdom",
    "eject": "react-scripts eject"
  },
  "devDependencies": {
    "css-loader": "^1.0.0",
    "redux-devtools-extension": "^2.13.5",
    "webpack": "^3.8.1"
  },
  "browserslist": [
    ">0.2%",
    "not dead",
    "not ie <= 11",
    "not op_mini all"
  ],
  "proxy": "http://localhost:4000"
}
like image 856
QHafeez Avatar asked Oct 22 '18 23:10

QHafeez


Video Answer


1 Answers

When using React please take a look into your package.json. You may find the following added there.

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

Remove "not dead", and run yarn run build again. Fixed the issue for me.

like image 53
Matthis Kohli Avatar answered Oct 22 '22 08:10

Matthis Kohli