nextjs/no-styled-jsx-in-document 正确性
它的作用
禁止在 pages/_document.js 中使用 styled-jsx。
为什么这是个问题?
自定义样式(如 styled-jsx)不允许在 自定义文档 中使用。
示例
此规则的错误代码示例:
javascript
// pages/_document.js
import Document, { Html, Head, Main, NextScript } from "next.document";
class MyDocument extends Document {
render() {
return (
<Html>
<Head />
<body>
<Main />
<NextScript />
<style jsx>{`
body {
background: hotpink;
}
`}</style>
</body>
</Html>
);
}
}此规则的正确代码示例:
javascript
// pages/_document.js
import Document, { Html, Head, Main, NextScript } from "next.document";
class MyDocument extends Document {
render() {
return (
<Html>
<Head />
<body>
<Main />
<NextScript />
</body>
</Html>
);
}
}如何使用
要通过配置文件或 CLI 启用此规则,可以使用:
json
{
"plugins": ["nextjs"],
"rules": {
"nextjs/no-styled-jsx-in-document": "error"
}
}bash
oxlint --deny nextjs/no-styled-jsx-in-document --nextjs-plugin