eslintrc.cjs is showing a Missed semicolon (CssSyntaxError) by default

Question

I am facing an error in the ESLint file after creating a React project using Vitejs

here is my eslint.cjs file content

module.exports = {
 root: true,
 env: {browser: true, es2020: true},
 extends: [
  'eslint:recommended',
  'plugin:react/recommended',
  'plugin:react/jsx-runtime',
  'plugin:react-hooks/recommended',
 ],
 ignorePatterns: ['dist', '.eslintrc.cjs'],
 parserOptions: {ecmaVersion: 'latest', sourceType: 'module'},
 settings: {react: {version: '18.2'}},
 plugins: ['react-refresh'],
 rules: {
  'react-refresh/only-export-components': ['warn', {allowConstantExport: true}],
 },
}

I have tried disabling the stylelint extension, but still nothing changed.