如何解决Next.js构建过程中的Eslint错误

Question

使用Next.js.中的npm run build命令执行构建

因此，出现以下Eslint错误：

info  - Checking validity of types
warn  - The Next.js plugin was not detected in your ESLint configuration. See https://nextjs.org/docs/basic-features/eslint#migrating-existing-config
Failed to compile.
./pages/hashtag/[tag].js
Error: Parsing error: require() of ES Module C:UsersAdministratorOneDriveDesktopRecipe.iopreparefrontnode_moduleseslint-scopelibdefinition.js from C:UsersAdministratorOneDriveDesktopRecipe.iopreparefrontnode_modulesbabel-eslintlibrequire-from-eslint.js not supported.
Instead change the require of definition.js in C:UsersAdministratorOneDriveDesktopRecipe.iopreparefrontnode_modulesbabel-eslintlibrequire-from-eslint.js to a dynamic import() which is available in all CommonJS modules.
./pages/index.js
Error: Parsing error: require() of ES Module C:UsersAdministratorOneDriveDesktopRecipe.iopreparefrontnode_moduleseslint-scopelibdefinition.js from C:UsersAdministratorOneDriveDesktopRecipe.iopreparefrontnode_modulesbabel-eslintlibrequire-from-eslint.js not supported.
Instead change the require of definition.js in C:UsersAdministratorOneDriveDesktopRecipe.iopreparefrontnode_modulesbabel-eslintlibrequire-from-eslint.js to a dynamic import() which is available in all CommonJS modules.
: 
:
All components and pages get the same error as above

我试着解决这个错误，但找不到方法，所以我在问。

如何解决上述错误，以便正常进行构建？

目前，我的项目中的package.json和.eslintrc文件如下。

"devDependencies": {
"babel-eslint": "^10.1.0",
"eslint": "^8.26.0",
"eslint-config-airbnb": "^19.0.4",
"eslint-plugin-import": "^2.26.0",
"eslint-plugin-jsx-a11y": "^6.6.1",
"eslint-plugin-react": "^7.31.10",
"eslint-plugin-react-hooks": "^4.6.0"
}
}

{
"parser": "babel-eslint",
"parserOptions": {
"ecmaVersion": 2020,
"sourceType": "module",
"ecmaFeatures": {
"jsx": true
}
},
"env": {
"browser": true,
"node": true,
"es6": true
},
"extends": [
"airbnb"
],
"plugins": [
"import",
"react-hooks"
],
"rules": {
"jsx-a11y/label-has-associated-control": "off",
"jsx-a11y/anchor-is-valid": "off",
"no-console": "off",
"no-underscore-dangle": "off",
"react/forbid-prop-types": "off",
"react/jsx-filename-extension": "off",
"object-curly-newline": "off",
"linebreak-style": "off",
"no-param-reassign": "off"
}

Answer 1

要解决该错误，请执行以下步骤：

1. 在vscode中安装elsint扩展
2. 将鼠标光标悬停在错误代码或红色字段中
3. 按ctrl+空格键，您将获得修复此错误的选项
4. 单击修复此错误
5. 然后你会再次看到选项列表
6. 单击其中一个或尝试删除该错误