如何解决Next.js中_app.js触发的Sonarqube“重命名此文件”代码异味

可行解决方案如下： #

• 方案1：调整默认导出命名匹配文件名
  直接修改_app.js中默认导出的组件/函数命名，和文件名保持一致即可：

  // 原写法（触发规则）
  export default function App({ Component, pageProps }) {
    return <Component {...pageProps} />
  }
  
  // 修改后写法（符合规则）
  export default function _app({ Component, pageProps }) {
    return <Component {...pageProps} />
  }
  

  这个改动完全不影响Next.js的框架逻辑，只是修改了导出函数的命名，就能直接消除代码异味。

• 方案2：局部忽略当前文件的对应规则
  如果不想修改导出命名，可以在_app.js文件中添加SonarQube规则忽略注释，仅屏蔽当前文件的这条规则校验：

  // sonar-ignore-next-line RSPEC-3317
  export default function App({ Component, pageProps }) {
    return <Component {...pageProps} />
  }
  

  也可以在文件顶部添加// NOSONAR注释，但更推荐上面的精准忽略方式，避免其他规则也被意外屏蔽。

• 方案3：全局配置排除特殊约定文件的规则校验
  如果你项目中还有_document.js、_error.js等其他Next.js约定的特殊文件，可以在SonarQube项目的规则配置页面，找到RSPEC-3317规则，添加路径排除项，把所有Next.js特殊约定文件的路径加入排除列表，后续所有这类文件都不会再触发这条规则校验。

• 方案4：ESLint配置层屏蔽规则（适用ESLint联动SonarQube的场景）
  如果你的项目是通过ESLint集成SonarQube规则校验，可以在.eslintrc.json中添加覆盖配置，专门针对这类特殊文件关闭对应规则：

  {
    "overrides": [
      {
        "files": ["pages/_*.js", "app/**/layout.js", "app/**/page.js"],
        "rules": {
          "sonarjs/default-export-name-match": "off"
        }
      }
    ]
  }
  

内容的提问来源于stack exchange，提问作者happy-integer