reactjstypescripteslintreact-typescripttypescript-eslint

Parsing error: __classPrivateFieldGet(...).at is not a function error


I fount the error saying "Parsing error: __classPrivateFieldGet(...).at is not a function (eslint) error image here

Parsing error: __classPrivateFieldGet(...).at is not a functioneslint

There are errors in every first line in every tsx files.

My project is made with typescript, React.

Here's my .eslintrc.js

// .eslintrc.js
module.exports = {
  root: true,
  parser: "@typescript-eslint/parser",
  plugins: ["@typescript-eslint", "prettier"],
  parserOptions: {
    project: "./tsconfig.json",
  },
  env: {
    node: true,
  },
  extends: [
    "plugin:prettier/recommended",
    "plugin:@typescript-eslint/recommended",
  ],
  parserOptions: {
    project: './tsconfig.json',
    sourceType: 'module',
    tsconfigRootDir: __dirname,
  },
  ignorePatterns: [".eslintrc.js"], 
  rules: {
    "react/jsx-filename-extension": [1, { extensions: [".ts", ".tsx"] }],
    '@typescript-eslint/ban-ts-comment': 'off',
    '@typescript-eslint/semi': 'off',
    '@typescript-eslint/space-before-function-paren': 'off',
  },
};

and this is tsconfig.json

{
  "compilerOptions": {
    "target": "es5",
    "lib": [
      "dom",
      "dom.iterable",
      "esnext"
    ],
    "allowJs": true,
    "skipLibCheck": true,
    "esModuleInterop": true,
    "allowSyntheticDefaultImports": true,
    "strict": true,
    "forceConsistentCasingInFileNames": true,
    "noFallthroughCasesInSwitch": true,
    "module": "esnext",
    "moduleResolution": "node",
    "resolveJsonModule": true,
    "isolatedModules": true,
    "noEmit": true,
    "jsx": "react-jsx",
    "importHelpers": true,
  },
  "include": [
    "src"
  ]
}

The application is running well though....

Can anyone know what __classPrivateFieldGet is and how I can fix this?

I tried to find some solutions from googling, but I couldn't find anything...


Solution

  • I ran into this exact issue. I was able to fix it by installing an earlier version of my ES Lint tools. I am not exactly sure which package or version started causing this issue, but I changed the following eslint versions and it fixed it for me. If you use prettier as your formatter, you will also have to downgrade that.

    My advice is to try downgrading any eslint libraries you have installed. Update your package.json with the earlier versions and run npm install, then retry.

    package.json:

    ...
    "devDependencies": {
        "@typescript-eslint/eslint-plugin": "^5.33.0",
        "@typescript-eslint/parser": "^5.33.0",
        "eslint-config-prettier": "^8.5.0",
        "eslint-import-resolver-typescript": "^3.4.0",
        "eslint-plugin-import": "^2.26.0",
        "eslint-plugin-prettier": "^4.2.1",
        "prettier": "^2.7.1",
    }
    ...
    

    Edit: As @Frank Turner mentioned, downgrading these two specific libraries to 6.5.0 will solve the issue:

    "@typescript-eslint/eslint-plugin": "6.5.0",
    "@typescript-eslint/parser": "6.5.0",