Failed to compile (Module parse failed: Unexpected token (4356:31))

182 Views Asked by At

In the process of cloning one of the project of the office I work at. I am getting this error.

[1] Failed to compile.
    [1]
    [1] ./node_modules/@hello-pangea/dnd/dist/dnd.esm.js 4356:31
    [1] Module parse failed: Unexpected token (4356:31)
    [1] File was processed with these loaders:
    [1]  * ./node_modules/babel-loader/lib/index.js
    [1] You may need an additional loader to handle the result of these loaders.
    [1] |   return Array.from(parentNode.querySelectorAll(selector));
    [1] | }
    [1] > var getWindowFromEl = el => el?.ownerDocument?.defaultView || window;
    [1] | function isHtmlElement(el) {
    [1] |   return el instanceof getWindowFromEl(el).HTMLElement;

I have downgrade my node version to v15.14.0 and npm to 6.14.8 in order for making this app run.

after cloning the project I installed the dependencies with npm i --legacy-peer-deps inside the root folder and as well as for frontend folder. I was getting all sorts of error because I had node version which wasn't compactible with this project so I downgraded my node version to v15.14.0 and it made those error go away. I was getting a proxy error while installing the dependencies so, I used this command npm config set registry http://registry.npmjs.org/ and it worked. After running the project this error is showing up and I am finding it hard to solve.

I have to think about changing the versions inside the project because It's a group project so in future it might not work. I want to know what options are there to solve this? I will share my package.json just in case

{
  "name": "frontend",
  "proxy": "http://127.0.0.1:6001",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "@material-table/core": "^6.1.17",
    "@material-ui/core": "^4.12.3",
    "@material-ui/icons": "^4.11.3",
    "@material-ui/lab": "^4.0.0-alpha.61",
    "@mui/x-data-grid": "^6.7.0",
    "@react-pdf/font": "2.2.0",
    "@react-pdf/renderer": " 2.1.0",
    "@reduxjs/toolkit": "^1.9.5",
    "@testing-library/jest-dom": "^5.11.4",
    "@testing-library/react": "^11.1.0",
    "@testing-library/user-event": "^12.1.10",
    "@tinymce/tinymce-react": "^4.1.0",
    "axios": "^0.22.0",
    "bootstrap": "^5.1.1",
    "chart.js": "^3.9.1",
    "date-fns": "^2.29.3",
    "downloadjs": "^1.4.7",
    "html-react-parser": "^2.0.0",
    "html2canvas": "^1.4.1",
    "i": "^0.3.7",
    "install": "^0.13.0",
    "json-server": "^0.16.3",
    "jspdf": "^2.5.1",
    "lodash": "^4.17.21",
    "lottie-react": "^2.4.0",
    "luxon": "^2.1.1",
    "material-table": "^1.69.3",
    "moment": "^2.29.4",
    "moment-timezone": "^0.5.43",
    "parse": "^3.4.2",
    "pdf-lib": "^1.17.1",
    "qs": "^6.11.2",
    "react": "^17.0.2",
    "react-beautiful-dnd": "^13.1.1",
    "react-big-calendar": "^1.6.9",
    "react-bootstrap": "^2.0.0-rc.0",
    "react-chartjs-2": "^4.3.1",
    "react-confetti": "^6.1.0",
    "react-datepicker": "^4.5.0",
    "react-dom": "^17.0.2",
    "react-dropzone": "^11.2.0",
    "react-facebook-login": "^4.1.1",
    "react-file-viewer": "^1.2.1",
    "react-hook-form": "7.19.0",
    "react-hot-toast": "^2.4.1",
    "react-infinite-scroll-component": "^6.1.0",
    "react-linkedin-login-oauth2": "^2.0.1",
    "react-pdf-html": "^1.1.18",
    "react-redux": "^7.2.5",
    "react-router-bootstrap": "^0.26.0",
    "react-router-dom": "^6.2.2",
    "react-scripts": "4.0.3",
    "react-select": "^5.2.1",
    "react-sortable-hoc": "^2.0.0",
    "react-toastify": "^8.2.0",
    "react-trello": "^2.2.11",
    "redux": "^4.1.1",
    "redux-devtools-extension": "^2.13.9",
    "redux-thunk": "^2.3.0",
    "socket.io-client": "^4.5.0",
    "web-vitals": "^1.0.1",
    "xlsx": "^0.17.5"
  },
  "devDependencies": {
    "react-error-overlay": "6.0.9"
  },
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
  },
  "eslintConfig": {
    "extends": [
      "react-app",
      "react-app/jest"
    ]
  },
  "browserslist": {
    "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
    "development": [
      "last 1 chrome version",
      "last 1 firefox version",
      "last 1 safari version"
    ]
  },
  "resolutions": {
    "@react-pdf/font": "2.2.0"
  }
}
0

There are 0 best solutions below