I created a Nex.js project which and it works well on my machine, but when ever i try to build the project, i get this error

 ⚠ The Next.js plugin was not detected in your ESLint configuration. See 

Failed to compile.

./pages/_app.tsx
1:1  Error: Parsing error: The keyword 'import' is reserved

./pages/_document.tsx
1:1  Error: Parsing error: The keyword 'import' is reserved

./pages/api/hello.tsx
3:1  Error: Parsing error: The keyword 'export' is reserved

./pages/index.tsx
1:1  Error: Parsing error: The keyword 'import' is reserved

./pages/profile.tsx
1:1  Error: Parsing error: The keyword 'import' is reserved

./pages/setup.tsx
1:1  Error: Parsing error: The keyword 'import' is reserved

./pages/signup.tsx
1:1  Error: Parsing error: The keyword 'import' is reserved

**This is what my eslint.config.js file looks like: **

/** @type {import('eslint').Linter.Config} */
module.exports = {
  extends: [
    'airbnb-base',
    'next',
    'next/core-web-vitals',
    'plugin:prettier/recommended',
  ],
  plugins: ['next', 'prettier'],
  parser: '@typescript-eslint/parser',  // Add parser for TypeScript (if using TypeScript)
  parserOptions: {
    ecmaVersion: 2020,  // Ensure ECMAScript 2020 (ESModules) support
    sourceType: 'module', // Enable module support for import/export statements
    ecmaFeatures: {
      jsx: true,  // Enable JSX support (if using React)
    },
  },
  rules: {
    'react/jsx-no-target-blank': 'off',
    'prettier/prettier': 'off',
    'no-unused-vars': 'warn',
    'no-console': 'warn',
  },
};

I have tried installing all the dependencies to ensure it is compatible in terms of versioning, but nothing seems to work

npm install eslint-plugin-next eslint-plugin-prettier eslint-config-prettier eslint-config-airbnb-base @typescript-eslint/parser --save-dev

npm install eslint@latest --save-dev

What am i missing?