跳到主要内容

Next.js 规则

@next/eslint-plugin-next 是针对 Next.js 框架的官方推荐规则集。它会检查 Next.js 项目中的常见错误和最佳实践，例如确保 next/image 组件的正确使用，或者 Link 组件的 href 属性格式正确等，有助于编写符合 Next.js 规范的代码。

// .eslintrc.js

module.exports = {
  extends: [
    'plugin:@next/next/recommended',
  ],
};
规则名称错误级别配置选项描述
@next/next/google-font-displaywarn-强制在Google Font链接中指定display属性
@next/next/google-font-preconnectwarn-检测缺失的Google Font预连接
@next/next/next-script-for-gawarn-要求Google Analytics使用Next.js的Script组件
@next/next/no-async-client-componentwarn-禁止在客户端组件中使用异步函数
@next/next/no-before-interactive-script-outside-documentwarn-检测在文档外使用beforeInteractive脚本
@next/next/no-css-tagswarn-禁止手动添加CSS标签
@next/next/no-head-elementwarn-要求使用Next.js的Head组件代替原生<head>
@next/next/no-html-link-for-pageswarn-要求使用Next.js路由代替静态<a>标签
@next/next/no-img-elementwarn-强制使用Next.js的Image组件代替<img>
@next/next/no-page-custom-fontwarn-禁止在页面中直接添加自定义字体
@next/next/no-styled-jsx-in-documentwarn-禁止在_document中使用styled-jsx
@next/next/no-sync-scriptswarn-检测同步加载的脚本
@next/next/no-title-in-document-headwarn-要求使用<Head>组件设置标题
@next/next/no-typoswarn-检测Next.js API名称拼写错误
@next/next/no-unwanted-polyfilliowarn-防止不必要的Polyfill.io使用
@next/next/inline-script-iderror-强制内联脚本必须包含ID
@next/next/no-assign-module-variableerror-禁止修改module变量
@next/next/no-document-import-in-pageerror-禁止在页面组件中导入_document
@next/next/no-duplicate-headerror-防止重复的<Head>组件
@next/next/no-head-import-in-documenterror-禁止在_document中导入Head组件
@next/next/no-script-component-in-headerror-禁止在<head>中使用Script组件