Bug: TypeError: this.cliEngine is not a constructor

Environment

Node version: v14.17.0 npm version: 6.14.13 Local ESLint version: 8.0.1 Operating System: macOS Big Sur

What parser are you using?

vue-eslint-parser

What did you do?

I’m using Vue CLI & after upgrading ESlint from version 7.32.0 to 8.0.1 I get the error Syntax Error: TypeError: eslint.CLIEngine is not a constructor after launching the project for development with npm run serve.

// .eslintrc.js
module.exports = {
  root: true,
  env: {
    node: true
  },
  extends: ["plugin:vue/essential", "@vue/prettier"],
  rules: {
    "no-console": process.env.NODE_ENV === "production" ? "error" : "off",
    "no-debugger": process.env.NODE_ENV === "production" ? "error" : "off"
  },
  parserOptions: {
    parser: "babel-eslint"
  }
};

What did you expect to happen?

Before upgrading ESlint, I was able to launch the project for development without issues.

What actually happened?

I got this error: Syntax Error: TypeError: eslint.CLIEngine is not a constructor & my code won’t compile for development.

Participation

~- [ ] I am willing to submit a pull request for this issue.~

Reproducible steps:

• Install Vue CLI globally, run the command: npm install -g @vue/cli.
• Create a project, run the command vue create todo-list-vue.
• Navigate to the project & install the latest version of ESlint, run the command cd todo-list-vue && npm install eslint@latest.
• Launch the project for development, run the command npm run serve.

You will get the following error in the console: Syntax Error: TypeError: eslint.CLIEngine is not a constructor