Error when upgrading `babel-eslint` to `@babel/eslint-parser`

babel-eslint is used in the latest ember new https://github.com/ember-cli/ember-new-output/blob/v3.23.0-beta.2/package.json#L27, however, it has moved:

https://babeljs.io/blog/2020/07/13/the-state-of-babel-eslint

module.exports = {
---  parser: "babel-eslint",
+++  parser: "@babel/eslint-parser"
    plugins: [
---   "babel"
+++   "@babel
    ]
};

When I try to replace the default babel-eslint, this error is thrown:

/home/travis/build/xg-wang/test--babel-eslint-parser/.eslintrc.js
  0:0  error  Parsing error: No Babel config file detected for /home/travis/build/xg-wang/test--babel-eslint-parser/.eslintrc.js. Either disable config file checking with requireConfigFile: false, or configure Babel so that it can find the config files

repro: https://github.com/xg-wang/test--babel-eslint-parser/commit/5b7df2998811a0dc213bf6f50d95a53cd43c2dff

[rwjblue]

You have to set the config flag requireConfigFile:

module.exports = {
  parser: '@babel/eslint',
  parserOptions: {
    requireConfigFile: false,
  },
  // ...snip...
}

I’d love a PR to the ember-cli blueprint to update to latest for folks if you have the time (no worries if not though!).

[frostyandy2k]

I got it running worked after spending some time trying out different options. Hope this helps anyone else getting stuck.

.eslintrc.json (in root project folder):

{
    "env": {
        "browser": true,
        "es2021": true,
        "jest/globals": true
    },
    "extends": [
        "standard",
        "plugin:jest/all"
    ],
    "parser": "@babel/eslint-parser",
    "parserOptions": {
        "ecmaVersion": 12,
        "sourceType": "module"
    },
    "rules": {
        "jest/no-hooks": [
            "error",
            {
                "allow": [
                    "afterEach",
                    "beforeEach"
                ]
            }
        ]
    },
    "plugins": [
        "jest"
    ]
}

Empty .babelrc (in root project folder):

{}

.package.json (in root project folder):

{
  "scripts": {
    "test": "jest",
    "lint": "npx eslint --format=table .",
    "lintfix": "npx eslint --fix ."
  },
  "devDependencies": {
    "@babel/core": "^7.15.0",
    "@babel/eslint-parser": "^7.15.0",
    "aws-sdk-mock": "^5.2.1",
    "eslint": "^7.32.0",
    "eslint-config-standard": "^16.0.3",
    "eslint-plugin-import": "^2.24.0",
    "eslint-plugin-jest": "^24.4.0",
    "eslint-plugin-node": "^11.1.0",
    "eslint-plugin-promise": "^5.1.0",
    "jest": "^27.0.6"
  }
}

VS Code settings.xml (editor configuration: enables auto fix on save + babel parser):

    "eslint.alwaysShowStatus": true,
    "eslint.format.enable": true,
    "eslint.lintTask.enable": true,
    "eslint.options": {
        "parser": "@babel/eslint-parser"
    },
    "editor.codeActionsOnSave": {
        "source.fixAll.eslint": true
    },
    "eslint.validate": [
        "javascript"
    ]