Plugin: react-featuresRules
void-dom-elements-no-children
Prevent void DOM elements from receiving children. This rule is part of eslint-plugin-react-features and provides LLM-optimized error messages.
Prevent void DOM elements from receiving children. This rule is part of eslint-plugin-react-features and provides LLM-optimized error messages.
Quick Summary
| Aspect | Details |
|---|---|
| Severity | Error (bug prevention) |
| Auto-Fix | ❌ No auto-fix |
| Category | React |
| ESLint MCP | ✅ Optimized for ESLint MCP integration |
| Best For | All React/JSX projects |
Rule Details
Void DOM elements like <br>, <hr>, <img>, <input> cannot have children. React ignores them but it's a mistake.
Examples
❌ Incorrect
<br>Some text</br>
<img src="photo.jpg">Caption</img>
<input type="text">Value</input>
<hr children="divider" />✅ Correct
<br />
<img src="photo.jpg" alt="Photo" />
<input type="text" value={value} />
<hr />Related Rules
jsx-no-duplicate-props- Prevent duplicate props
Use this rule
npm install -D oxlint-plugin-react-features{ "jsPlugins": ["oxlint-plugin-react-features"], "rules": { "react-features/void-dom-elements-no-children": "error" }}import { defineConfig } from 'vite-plus';export default defineConfig({ lint: { jsPlugins: ['oxlint-plugin-react-features'], rules: { 'react-features/void-dom-elements-no-children': 'error', }, },});oxlint-plugin-react-features re-exports eslint-plugin-react-features/oxlint: the same rules under the same IDs, and no ESLint install. Why oxlint.
Did this rule catch something? Star the repo to get new CWE coverage as we ship it — or follow the AI-code-security benchmarks behind these rules.