How do I overcome parcel-bundler error create-near-app

Question

Hi I have created a near app with a react frontend but when I try to install @date-io/date-fns I get an error:

Cannot read property 'length' of undefined
    at lineCounter (C:\Users\Simon Palmer\Documents\Programming\bimstarter-app\node_modules\parcel-bundler\src\utils\lineCounter.js:3:30)
    at JSPackager.writeModule (C:\Users\Simon Palmer\Documents\Programming\bimstarter-app\node_modules\parcel-bundler\src\packagers\JSPackager.js:127:60)
    at async JSPackager.addAsset (C:\Users\Simon Palmer\Documents\Programming\bimstarter-app\node_modules\parcel-bundler\src\packagers\JSPackager.js:88:5)
    at async Bundle._addDeps (C:\Users\Simon Palmer\Documents\Programming\bimstarter-app\node_modules\parcel-bundler\src\Bundle.js:250:5)
    at async Bundle._package (C:\Users\Simon Palmer\Documents\Programming\bimstarter-app\node_modules\parcel-bundler\src\Bundle.js:219:7)
    at async Promise.all (index 0)
    at async Bundle.package (C:\Users\Simon Palmer\Documents\Programming\bimstarter-app\node_modules\parcel-bundler\src\Bundle.js:202:5)
    at async Promise.all (index 2)
    at async Bundle.package (C:\Users\Simon Palmer\Documents\Programming\bimstarter-app\node_modules\parcel-bundler\src\Bundle.js:202:5)
    at async Bundler.bundle (C:\Users\Simon Palmer\Documents\Programming\bimstarter-app\node_modules\parcel-bundler\src\Bundler.js:325:27)

my package.json file is as follows

{
  "name": "bimstarter-app",
  "version": "0.1.0",
  "license": "UNLICENSED",
  "scripts": {
    "build": "npm run build:contract && npm run build:web",
    "build:contract": "node contract/compile.js",
    "build:contract:debug": "node contract/compile.js --debug",
    "build:web": "parcel build src/index.html --public-url ./",
    "dev:deploy:contract": "near dev-deploy",
    "deploy:contract": "near deploy",
    "deploy:pages": "gh-pages -d dist/",
    "deploy": "npm run build && npm run deploy:contract && npm run deploy:pages",
    "prestart": "npm run build:contract:debug && npm run dev:deploy:contract",
    "start": "echo The app is starting! It will automatically open in your browser when ready && env-cmd -f ./neardev/dev-account.env parcel src/index.html --open",
    "dev": "nodemon --watch contract -e ts --exec \"npm run start\"",
    "test": "npm run build:contract:debug && cd contract && npm run test && cd .. && jest test --runInBand"
  },
  "devDependencies": {
    "@babel/core": "~7.14.0",
    "@babel/preset-env": "~7.14.0",
    "@babel/preset-react": "~7.13.13",
    "babel-jest": "~26.6.2",
    "env-cmd": "~10.1.0",
    "gh-pages": "~3.1.0",
    "jest": "~26.6.2",
    "jest-environment-node": "~26.6.2",
    "near-cli": "~2.1.1",
    "nodemon": "~2.0.3",
    "parcel-bundler": "^1.12.5",
    "react-test-renderer": "~17.0.1",
    "shelljs": "~0.8.4"
  },
  "dependencies": {
    "@date-io/date-fns": "^2.13.1",
    "@emotion/react": "^11.9.0",
    "@emotion/styled": "^11.8.1",
    "@mui/icons-material": "^5.6.2",
    "@mui/material": "^5.6.2",
    "@mui/x-date-pickers": "^5.0.0-alpha.1",
    "near-api-js": "~0.43.1",
    "react": "~17.0.1",
    "react-dom": "~17.0.1",
    "react-router-dom": "6",
    "regenerator-runtime": "~0.13.5"
  },
  "resolutions": {
    "@babel/preset-env": "7.13.8"
  },
  "jest": {
    "moduleNameMapper": {
      "\\.(jpg|ico|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$": "<rootDir>/src/__mocks__/fileMock.js",
      "\\.(css|less)$": "<rootDir>/src/__mocks__/fileMock.js"
    },
    "setupFiles": [
      "<rootDir>/src/jest.init.js"
    ],
    "testEnvironment": "near-cli/test_environment",
    "testPathIgnorePatterns": [
      "<rootDir>/contract/",
      "<rootDir>/node_modules/"
    ]
  }

This happened also when I was trying to install react bootstrap. To build again does the parcel-bundler need to be upgraded to parcel as it has been depreciated? If so how do I do this without effecting the rest of the near app code dependencies?