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

Question

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"
}
}

Answer 1

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.