no-danger-with-children

Prevent using children and dangerouslySetInnerHTML together. This rule is part of eslint-plugin-react-features and provides LLM-optimized error messages.

Quick SummaryCopy Anchor Link

Rule DetailsCopy Anchor Link

Using both children and dangerouslySetInnerHTML is ambiguous - React will throw an error.

ExamplesCopy Anchor Link

❌ IncorrectCopy Anchor Link

<div dangerouslySetInnerHTML={{ __html: html }}>
  Some text
</div>

<div dangerouslySetInnerHTML={{ __html: html }} children="text" />

✅ CorrectCopy Anchor Link

<div dangerouslySetInnerHTML={{ __html: html }} />

<div>Some text</div>

Related RulesCopy Anchor Link

• no-danger - Warn about dangerouslySetInnerHTML usage

Use this rule

npm install -D oxlint-plugin-react-features

{  "jsPlugins": ["oxlint-plugin-react-features"],  "rules": {    "react-features/no-danger-with-children": "error"  }}

import { defineConfig } from 'vite-plus';export default defineConfig({  lint: {    jsPlugins: ['oxlint-plugin-react-features'],    rules: {      'react-features/no-danger-with-children': 'error',    },  },});