Home > front end >  Module parse failed: Unexpected token (257:106) You may need an appropriate loader to handle this fi
Module parse failed: Unexpected token (257:106) You may need an appropriate loader to handle this fi

Time:11-05

After running 'npm update' on my app, I am suddenly getting the following error:

Compiled with problems:

ERROR in ./node_modules/pako/lib/zlib/trees.js 257:106

Module parse failed: Unexpected token (257:106)
File was processed with these loaders:
 * ./node_modules/babel-loader/lib/index.js
You may need an additional loader to handle the result of these loaders.
|  *     not null.
|  */
> function gen_bitlen(s, desc) /*    deflate_state *s;*/ /*    tree_desc *desc;    /* the tree descriptor */*/{
|   var tree = desc.dyn_tree;
|   var max_code = desc.max_code;

Strange. So I compared it to the same app running on a different workstation with the same code, but where I did not run 'npm update'. The app works, no surprise.

I've seen other posts with this error, but their solutions do not seem to apply to my environment.

I cannot figure out why it's not working on my main workstation. If I copy over node_modules from the working station, the app starts fine. But as soon as I remove node_modules and package-lock.json and reinstall, the app will not start. I've removed node_modules/package-lock.json/clear npm cache. Doesn't help.

I'm comparing the module versions via 'npm ls', and they are identical on both workstations.

Both are running NodeJS 8.12.0 and npm 8.19.2

I looked at the file that it's erroring out on (pako/lib/zlib/trees.js), and it's identical on both systems.

I have no idea what 'pako' is, but using 'npm explain pako' it appears to have something to do with pdf-lib, which was never updated.

My app was built with create-react-app.

I'm at a complete loss. Here is my package.json:

{
  "name": "foo",
  "version": "0.1.0",
  "description": "Foo",
  "contributors": [],
  "license": "UNLICENSED",
  "private": true,
  "dependencies": {
    "@coreui/chartjs": "^2.0.0",
    "@coreui/coreui-pro": "^3.4.2",
    "@coreui/icons": "^2.1.0",
    "@coreui/icons-pro": "^2.0.3",
    "@coreui/icons-react": "^1.1.0",
    "@coreui/react": "^3.4.6",
    "@coreui/react-chartjs": "^1.1.0",
    "@coreui/utils": "^1.3.1",
    "@fortawesome/fontawesome-free-solid": "^5.0.13",
    "@fortawesome/fontawesome-svg-core": "^6.1.1",
    "@fortawesome/free-regular-svg-icons": "^6.1.1",
    "@fortawesome/free-solid-svg-icons": "^6.1.1",
    "@fortawesome/react-fontawesome": "^0.1.18",
    "@nadavshaar/react-grid-table": "^1.0.0",
    "@pdf-lib/fontkit": "^1.1.1",
    "@react-firebase/auth": "^0.2.10",
    "ag-grid-community": "^25.3.0",
    "ag-grid-react": "^25.3.0",
    "arithmetic": "^1.0.1",
    "bootstrap": "^5.2.0",
    "classnames": "^2.3.1",
    "codemirror": "^5.63.3",
    "core-js": "^3.19.1",
    "downloadjs": "^1.4.7",
    "firebase": "^9.12.1",
    "firebase-admin": "^11.0.1",
    "firebaseui": "^6.0.1",
    "formik": "^2.2.9",
    "mobx": "^6.3.3",
    "mobx-react": "^7.1.0",
    "pdf-lib": "^1.17.1",
    "prop-types": "^15.7.2",
    "random-id": "^1.0.4",
    "react": "^17.0.2",
    "react-app-polyfill": "^2.0.0",
    "react-awesome-button": "^6.5.1",
    "react-big-calendar": "^0.33.6",
    "react-bootstrap": "^2.4.0",
    "react-collapsible": "^2.10.0",
    "react-cookie-consent": "^8.0.1",
    "react-dom": "^17.0.2",
    "react-firebase-hooks": "^5.0.3",
    "react-firebaseui": "^6.0.0",
    "react-grid-layout": "^1.3.0",
    "react-range": "^1.8.12",
    "react-redux": "7.2.4",
    "react-router-dom": "^5.3.0",
    "react-select": "^4.3.1",
    "react-text-mask-hoc": "^0.11.0",
    "react-toastify": "^9.0.8",
    "reactstrap": "^8.10.0",
    "redux": "4.1.0",
    "rpg-dice-roller": "1.6.0",
    "sass": "^1.55.0",
    "sillyname": "^0.1.0",
    "spinkit": "2.0.1",
    "string-math": "^1.2.2",
    "styled-components": "^5.3.3",
    "yup": "^0.32.11"
  },
  "devDependencies": {
    "mutationobserver-shim": "^0.3.7",
    "react-scripts": "^5.0.0"
  },
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "test:cov": "npm test -- --coverage --watchAll=false",
    "test:debug": "react-scripts --inspect-brk test --runInBand",
    "eject": "react-scripts eject",
    "zip": "git archive -o coreui-pro-react-admin-template-v$npm_package_version.zip -9 HEAD"
  },
  "bugs": {
    "url": "https://github.com/coreui/coreui-free-react-admin-template/issues"
  },
  "eslintConfig": {
    "extends": "react-app"
  },
  "browserslist": [
    ">0.2%",
    "not dead",
    "not ie <= 10",
    "not op_mini all"
  ],
  "jest": {
    "collectCoverageFrom": [
      "src/**/*.{js,jsx}",
      "!**/*index.js",
      "!src/serviceWorker.js",
      "!src/polyfill.js"
    ]
  },
  "engines": {
    "node": ">=8.16",
    "npm": ">=6"
  }
}

If anyone has any suggestions, please let me know. Thank you in advance.

CodePudding user response:

I am getting the same error on my beta machine and strangely not on my alpha machine. Which is weird it is the same code and project files on both. Not able figure out the details. I am using pako and Angular 13.

CodePudding user response:

I got the same error while building a large react app. It happened in the afternoon of Nov 4 2022. The build worked in the morning of that day. The build has NPM version 7.18.1.

  • Related