noHeadImportInDocument

JSX and TSX

摘要

¥Summary

规则生效日期：v1.9.4

¥Rule available since: v1.9.4
诊断类别：lint/suspicious/noHeadImportInDocument

¥Diagnostic Category: lint/suspicious/noHeadImportInDocument
此规则没有修复方案。

¥This rule doesn’t have a fix.
此规则的默认严重级别为 warning。

¥The default severity of this rule is warning.
此规则属于以下域：

¥This rule belongs to the following domains:
- next
来源：

¥Sources:
- 与 @next/next/no-head-import-in-document 相同
  
  ¥Same as @next/next/no-head-import-in-document

如何配置

¥How to configure

1
{
2
  "linter": {
3
    "rules": {
4
      "suspicious": {
5
        "noHeadImportInDocument": "error"
6
      }
7
    }
8
  }
9
}

描述

¥Description

防止在 Next.js 项目中使用 pages/_document.js 中的 next/head 模块。

¥Prevent using the next/head module in pages/_document.js on Next.js projects.

在自定义 pages/_document.js 文件中导入 next/head 可能会导致应用出现意外行为。next/head 组件设计用于页面级别，在自定义文档中使用时，可能会干扰全局文档结构，从而导致渲染和 SEO 问题。

¥Importing next/head within the custom pages/_document.js file can cause unexpected behavior in your application. The next/head component is designed to be used at the page level, and when used in the custom document it can interfere with the global document structure, which leads to issues with rendering and SEO.

要修改所有页面上的 <head> 元素，你应该使用 next/document 模块中的 <Head /> 组件。

¥To modify <head> elements across all pages, you should use the <Head /> component from the next/document module.

示例

¥Examples

有效

¥Valid

1
import Document, { Html, Head, Main, NextScript } from "next/document";
2

3
class MyDocument extends Document {
4
  static async getInitialProps(ctx) {
5
    //...
6
  }
7

8
  render() {
9
    return (
10
      <Html>
11
        <Head></Head>
12
      </Html>
13
    );
14
  }
15
}
16

17
export default MyDocument;

noHeadImportInDocument

摘要

如何配置

描述

示例

有效

相关链接