← Back to rules

react/jsx-no-comment-textnodes Suspicious

作用

此规则可防止注释字符串（例如以 // 或 /* 开头的字符串）被意外注入为 JSX 语句中的文本节点。

为什么这不好？

在 JSX 中，任何未用花括号包裹的文本节点都会被视为要渲染的字面字符串。当文本中包含注释时，这可能会导致意外行为。

示例

以下是此规则的错误代码示例：

const Hello = () => {
  return <div>// empty div</div>;
};

const Hello = () => {
  return <div>/* empty div */</div>;
};

以下是此规则的正确代码示例：

const Hello = () => {
  return <div>{/* empty div */}</div>;
};

如何使用

To enable this rule using the config file or in the CLI, you can use:

Config (.oxlintrc.json)

{
  "plugins": ["react"],
  "rules": {
    "react/jsx-no-comment-textnodes": "error"
  }
}

Config (oxlint.config.ts)

import { defineConfig } from "oxlint";

export default defineConfig({
  plugins: ["react"],
  rules: {
    "react/jsx-no-comment-textnodes": "error",
  },
});

CLI

oxlint --deny react/jsx-no-comment-textnodes --react-plugin

版本

此规则是在 v0.0.14 中添加的。

参考资料

• Rule Source
• Open rule in Oxc Playground