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"
}
}
GitHub - browserslist/caniuse-lite: A smaller version of caniuse-db, with only the essentials! Skip to content Toggle navigation. Product. Actions. Automate any workflow.
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? 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.
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.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With