Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How do I fix 'Browserslist: caniuse-lite is outdated' for my Vue build?

Tags:

babeljs

vue.js

When doing a vue-cli build through npm I get this error:

Browserslist: caniuse-lite is outdated. Please run next command `npm update caniuse-lite browserslist`

This was working until recently and I'm not sure what would cause this to start failing. Seems like some timeframe hit that made it start reporting as 'outdated' but I don't know what to update to fix it.

I have tried running the suggested command but it doesn't do the trick. I am doing this through npm and am not using Visual Studio, so I am not using WebCompiler (and that directory doesn't exist in my user folder) so the solution in Browserslist: caniuse-lite is outdated. Please run next command `npm update caniuse-lite browserslist` doesn't apply.

This also happens on our build system running through VSO, so it isn't just my box.

Here is my package.json file:

{
  "name": "productName.portal",
  "version": "1.0.0",
  "description": "productName.portal static content",
  "main": "gulpfile.js",
  "keywords": [
    "gulp",
    "task"
  ],
  "author": "",
  "license": "ISC",
  "devDependencies": {
    "@babel/preset-react": "^7.0.0",
    "@types/jest": "^23.1.4",
    "@types/jquery": "^3.3.4",
    "@types/underscore": "^1.8.8",
    "@voerro/vue-tagsinput": "^1.8.0",
    "@vue/cli-plugin-babel": "^3.0.0-rc.4",
    "@vue/cli-plugin-typescript": "^3.0.0-rc.4",
    "@vue/cli-plugin-unit-jest": "^3.0.1",
    "@vue/cli-service": "3.0.0-rc.4",
    "@vue/test-utils": "^1.0.0-beta.20",
    "axios": "^0.18.0",
    "babel-core": "7.0.0-bridge.0",
    "babel-polyfill": "^6.26.0",
    "copy-webpack-plugin": "^4.5.2",
    "gulp": "^3.9.0",
    "gulp-clean-css": "latest",
    "gulp-concat": "latest",
    "gulp-sourcemaps": "latest",
    "gulp-uglify": "latest",
    "jquery": "^3.3.1",
    "moment": "^2.22.2",
    "node-sass": "^4.9.0",
    "sass-loader": "^7.0.1",
    "script-loader": "^0.7.2",
    "stylus": "^0.54.5",
    "stylus-loader": "^3.0.2",
    "ts-jest": "^23.0.0",
    "underscore": "^1.9.1",
    "vue-i18n": "^8.0.0",
    "vue-js-modal": "^1.3.16",
    "vue-loading-overlay": "^2.1.0",
    "vue-simple-spinner": "^1.2.8",
    "vue-template-compiler": "^2.5.16",
    "vue-toasted": "^1.1.24",
    "vuejs-datepicker": "^1.5.2"
  },
  "dependencies": {
    "node": "^9.9.0",
    "typescript": "^3.0.1",
    "trie-search": "^1.2.8",
    "vue": "^2.5.16",
    "vue-class-component": "^6.0.0",
    "vue-property-decorator": "^7.0.0",
    "vuex": "^3.0.1"
  },
  "scripts": {
    "serve": "vue-cli-service serve",
    "build": "vue-cli-service build",
    "lint": "vue-cli-service lint",
    "unittest": "vue-cli-service test:unit"
  }
}
like image 955
Jeremy Avatar asked Mar 28 '19 23:03

Jeremy


People also ask

What is Browserslist caniuse-lite?

GitHub - browserslist/caniuse-lite: A smaller version of caniuse-db, with only the essentials! Skip to content Toggle navigation. Product. Actions. Automate any workflow.

What is NPX Browserslist latest -- update DB?

npx update-browserslist-db@latest updates caniuse-lite version in your npm, yarn or pnpm lock file. This update will bring data about new browsers to polyfills tools like Autoprefixer or Babel and reduce already unnecessary polyfills.

What is Browserslist in package JSON?

What is Browserslist? Browserslist is a tool that allows specifying which browsers should be supported in your frontend app by specifying "queries" in a config file. It's used by frameworks/libraries such as React, Angular and Vue, but it's not limited to them.


1 Answers

This is all down to the dependencies of @babel/preset-env

├─┬ @babel/preset-env
│ ├─┬ browserslist
│ │ ├── caniuse-lite

You can rectify this by updating that package

npm update @babel/preset-env

Just realised that Vue uses a few more levels of dependency

├─┬ @vue/cli-plugin-babel
│ ├─┬ @vue/babel-preset-app
│ │ ├─┬ @babel/preset-env

so you'll want to update the @vue/cli-plugin-babel package.

like image 158
Phil Avatar answered Oct 29 '22 00:10

Phil