NextJS 13编译失败：jsx-quotes单引号使用违规错误排查

以下是针对问题的排查和解决步骤：

• 统一ESLint配置文件，避免冲突
  ESLint读取配置有优先级，.eslintrc.js优先级高于.eslintrc.json，建议只保留一个配置文件（优先选.js，支持逻辑扩展）。同时确保自定义规则覆盖extends中的默认设置：

  // .eslintrc.js
  module.exports = {
    extends: ['next/core-web-vitals'],
    rules: {
      // 明确指定规则，确保优先级最高
      "jsx-quotes": ["error", "prefer-double"]
    }
  };
  

• 清除ESLint缓存
  缓存可能导致新配置不生效，执行命令清除缓存：

  npx eslint --cache-clear
  

• 重启VSCode的ESLint服务
  在VSCode中按下Ctrl+Shift+P（Windows/Linux）或Cmd+Shift+P（Mac），搜索并执行「ESLint: Restart ESLint Server」，让插件重新加载最新配置。

• 检查VSCode工作区/全局设置
  打开VSCode的settings.json，确认没有覆盖ESLint规则的配置：

  // 避免以下可能冲突的设置
  "editor.quotes": "single", // 可改为"double"对齐ESLint规则
  "eslint.options": {
    // 不要在此处自定义jsx-quotes规则
  }
  

• 排查其他配置来源
  检查项目根目录是否存在.eslintrc.yml、.eslintrc或package.json中的eslintConfig字段，这些文件也会被ESLint读取，确保它们的jsx-quotes规则与预期一致。

• 手动验证规则生效情况
  直接运行ESLint命令检测目标文件：

  npx eslint ./pages/ # 替换为你报错的文件目录或具体文件路径
  

  如果仍报错，检查文件中JSX属性是否确实使用了单引号（比如<div className='test'>），需改为双引号；若需保留单引号，可将规则改为["error", "prefer-single"]。

内容的提问来源于stack exchange，提问作者Mitch