0

I have been trying to build a production version of my code that built just fine previously. Now, when I run vue build on my main.js file it provides the following:

\  Building for production...Browserslist: caniuse-lite is outdated. Please run next command `npm update caniuse-lite browserslist`
\  Building for production...Browserslist: caniuse-lite is outdated. Please run next command `npm update caniuse-lite browserslist`
Browserslist: caniuse-lite is outdated. Please run next command `npm update caniuse-lite browserslist`
\  Building for production...Browserslist: caniuse-lite is outdated. Please run next command `npm update caniuse-lite browserslist`
(node:10708) UnhandledPromiseRejectionWarning: Unhandled promise rejection (rejection id: 1): Error: CSS minification error: Unknown browser query `basedir=$(dirname "$(echo "$0" | sed -e 's`. Maybe you are using old Browserslist or made typo in query.. File: css/app.75eb53b0.css
(node:10708) [DEP0018] DeprecationWarning: Unhandled promise rejections are deprecated. In the future, promise rejections that are not handled will terminate the Node.js process with a non-zero exit code.

I have attempted to resolve the Browserslist/caniuse-lite error by manually updating the package, and packages that are dependent upon it, starting a new project, running npm --depth 999 commands (depth 9999 causes a memory heap error), and everything else I can find to do. I am not using VS (using VS Code) but attempted to work around by removing the WebCompiler information from my AppData, but do not have a WebCompiler folder to begin with.

I have additionally tried reverting back to css-loader 2.1.1, which resolved another issue that came up while working on this, but it has not resolved this issue.

Any help would be greatly appreciated as this is stopping any updates from being published to production.

I have attempted the fixes in the other thread regarding the Browserslist warning. Additionally those threads do not mention the following error:

(node:10708) UnhandledPromiseRejectionWarning: Unhandled promise rejection (rejection id: 1): Error: CSS minification error: Unknown browser query `basedir=$(dirname "$(echo "$0" | sed -e 's`. Maybe you are using old Browserslist or made typo in query.. File: css/app.75eb53b0.css
(node:10708) [DEP0018] DeprecationWarning: Unhandled promise rejections are deprecated. In the future, promise rejections that are not handled will terminate the Node.js process with a non-zero exit code.

The following is my package.json for the project

{
  "name": "coeus",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "serve": "vue-cli-service serve",
    "build": "vue-cli-service build",
    "lint": "vue-cli-service lint"
  },
  "dependencies": {
    "@fortawesome/fontawesome-svg-core": "^1.2.25",
    "@fortawesome/free-brands-svg-icons": "^5.11.2",
    "@fortawesome/free-solid-svg-icons": "^5.11.2",
    "@fortawesome/vue-fontawesome": "^0.1.7",
    "axios": "^0.19.0",
    "bcrypt": "^3.0.6",
    "bcryptjs": "^2.4.3",
    "body-parser": "^1.19.0",
    "bootstrap-vue": "^2.0.2",
    "browserslist": "^4.7.0",
    "caniuse-lite": "^1.0.30000997",
    "cors": "^2.8.5",
    "dns": "^0.2.2",
    "express": "^4.17.1",
    "express-fileupload": "^1.1.5",
    "fast-csv": "^3.4.0",
    "json-loader": "^0.5.7",
    "jsonwebtoken": "^8.5.1",
    "method-override": "^3.0.0",
    "mongoose": "^5.7.1",
    "morgan": "^1.9.1",
    "nodemailer": "^6.3.0",
    "npm": "^6.11.3",
    "path": "^0.12.7",
    "vue": "^2.6.10",
    "vue-router": "^3.1.3",
    "vuex": "^3.1.1"
  },
  "devDependencies": {
    "@vue/cli-plugin-babel": "^3.11.0",
    "@vue/cli-plugin-eslint": "^3.11.0",
    "@vue/cli-service": "^3.11.0",
    "@vue/eslint-config-prettier": "^5.0.0",
    "css-loader": "^2.1.1",
    "style-loader": "^1.0.0",
    "vue-template-compiler": "^2.6.10"
  }
}
GM-Rawl
  • 1
  • 3
  • You are looking for this https://stackoverflow.com/questions/55271798/browserslist-caniuse-lite-is-outdated-please-run-next-command-npm-update-cani – Sachin Yadav Sep 24 '19 at 18:46
  • Thank you, however "C:\Users\USERNAME\AppData\Local\Temp\WebCompilerX.X.X" does not exist for me – GM-Rawl Sep 24 '19 at 18:48
  • Possible duplicate of [Browserslist: caniuse-lite is outdated. Please run next command \`npm update caniuse-lite browserslist\`](https://stackoverflow.com/questions/55271798/browserslist-caniuse-lite-is-outdated-please-run-next-command-npm-update-cani) – Sachin Yadav Sep 24 '19 at 18:50
  • Possibly, though I have tried all of the fixes in that thread, and it does not mention the `(node:10708) UnhandledPromiseRejectionWarning: Unhandled promise rejection (rejection id: 1): Error: CSS minification error: Unknown browser query `basedir=$(dirname "$(echo "$0" | sed -e 's`. Maybe you are using old Browserslist or made typo in query.. File: css/app.75eb53b0.css (node:10708) [DEP0018] DeprecationWarning: Unhandled promise rejections are deprecated. In the future, promise rejections that are not handled will terminate the Node.js process with a non-zero exit code.` – GM-Rawl Sep 24 '19 at 18:58
  • Please show your JSON code – Sachin Yadav Sep 24 '19 at 19:03
  • Happy to do so, where would you like the JSON from? – GM-Rawl Sep 24 '19 at 19:13
  • Show some code and don't just directly post errors – Sachin Yadav Sep 24 '19 at 19:16
  • package.json added – GM-Rawl Sep 24 '19 at 19:27
  • Run this npm i browserslist@4.6.3 – Sachin Yadav Sep 24 '19 at 19:40
  • browserslist items are in a .browserslistrc file: `> 1%`, `last 2 versions`, and `not ie <= 8` – GM-Rawl Sep 24 '19 at 19:42
  • Attempted `npm i browserslist@4.6.3` and then ran `vue build src/main.js`. Received the same warnings and error – GM-Rawl Sep 24 '19 at 19:44
  • Can you please show what all items are present in browserlist – Sachin Yadav Sep 24 '19 at 19:44
  • Do you want the package.json of the browserlist package? The config items are listed above. Just want to get you the information you are looking for and really appreciate the help! – GM-Rawl Sep 24 '19 at 19:53
  • Do you have something like this "browserslist": [ ">0.2%", "not dead", "not ie <= 11", "not op_mini all" ] – Sachin Yadav Sep 24 '19 at 19:55
  • Yes, they are in a .browserslistrc file. I have > 1%, last 2 versions, and not ie <= 8 – GM-Rawl Sep 24 '19 at 20:14

1 Answers1

0

I am not sure why this is (I could have missed it in the docs) but I figured out that I was using a vue build command to build the production version. After looking over a few things I tried npm run build and not only did not get the Browserslist warning, but did not encounter the minify error either. Thank you for all of the help!

GM-Rawl
  • 1
  • 3