nextjs/no-styled-jsx-in-document Correctness
它的作用
禁止在 pages/_document.js 中使用 styled-jsx。
为什么这不好?
像 styled-jsx 这样的自定义 CSS 不允许出现在 Custom Document 中。
示例
以下是此规则的错误代码示例:
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>
);
}
}如何使用
To enable this rule using the config file or in the CLI, you can use:
json
{
"plugins": ["nextjs"],
"rules": {
"nextjs/no-styled-jsx-in-document": "error"
}
}ts
import { defineConfig } from "oxlint";
export default defineConfig({
plugins: ["nextjs"],
rules: {
"nextjs/no-styled-jsx-in-document": "error",
},
});bash
oxlint --deny nextjs/no-styled-jsx-in-document --nextjs-plugin版本
此规则在 v0.3.3 中添加。
