eslint-config-alloy

{ "react/boolean-prop-naming": { "name": "react/boolean-prop-naming", "value": "off", "description": "布尔值类型的 propTypes 的 name 必须为 is 或 has 开头", "reason": "类型相关的约束交给 TypeScript", "badExample": "", "goodExample": "", "fixable": false, "extendsBaseRule": "", "requiresTypeChecking": false }, "react/button-has-type": { "name": "react/button-has-type", "value": "off", "description": "<button> 必须有 type 属性", "reason": "", "badExample": "", "goodExample": "", "fixable": false, "extendsBaseRule": "", "requiresTypeChecking": false }, "react/default-props-match-prop-types": { "name": "react/default-props-match-prop-types", "value": "off", "description": "一个 defaultProps 必须有对应的 propTypes", "reason": "类型相关的约束交给 TypeScript", "badExample": "", "goodExample": "", "fixable": false, "extendsBaseRule": "", "requiresTypeChecking": false }, "react/destructuring-assignment": { "name": "react/destructuring-assignment", "value": "off", "description": "props, state, context 必须用解构赋值", "reason": "", "badExample": "", "goodExample": "", "fixable": true, "extendsBaseRule": "", "requiresTypeChecking": false }, "react/display-name": { "name": "react/display-name", "value": "off", "description": "组件必须有 displayName 属性", "reason": "不强制要求写 displayName", "badExample": "", "goodExample": "", "fixable": false, "extendsBaseRule": "", "requiresTypeChecking": false }, "react/forbid-component-props": { "name": "react/forbid-component-props", "value": "off", "description": "禁止在自定义组件中使用指定的 props", "reason": "", "badExample": "", "goodExample": "", "fixable": false, "extendsBaseRule": "", "requiresTypeChecking": false }, "react/forbid-dom-props": { "name": "react/forbid-dom-props", "value": "off", "description": "禁止在 dom 组件中使用指定的 props", "reason": "", "badExample": "", "goodExample": "", "fixable": false, "extendsBaseRule": "", "requiresTypeChecking": false }, "react/forbid-elements": { "name": "react/forbid-elements", "value": "off", "description": "禁止使用指定的组件", "reason": "", "badExample": "", "goodExample": "", "fixable": false, "extendsBaseRule": "", "requiresTypeChecking": false }, "react/forbid-foreign-prop-types": { "name": "react/forbid-foreign-prop-types", "value": "off", "description": "禁止使用另一个组件的 propTypes", "reason": "类型相关的约束交给 TypeScript", "badExample": "", "goodExample": "", "fixable": false, "extendsBaseRule": "", "requiresTypeChecking": false }, "react/forbid-prop-types": { "name": "react/forbid-prop-types", "value": "off", "description": "禁止使用 PropTypes.any PropTypes.array 和 PropTypes.object", "reason": "类型相关的约束交给 TypeScript", "badExample": "", "goodExample": "", "fixable": false, "extendsBaseRule": "", "requiresTypeChecking": false }, "react/function-component-definition": { "name": "react/function-component-definition", "value": "off", "description": "限制函数式组件的函数形式（函数声明、函数表达式或箭头函数）", "reason": "一些场景还不能覆盖，如 export default function，自动修复功能在 ts 中有些问题", "badExample": "", "goodExample": "", "fixable": true, "extendsBaseRule": "", "requiresTypeChecking": false }, "react/hook-use-state": { "name": "react/hook-use-state", "value": "off", "description": "hook 的返回值必须与 useState 的解构对应", "reason": "", "badExample": "", "goodExample": "", "fixable": false, "extendsBaseRule": "", "requiresTypeChecking": false }, "react/iframe-missing-sandbox": { "name": "react/iframe-missing-sandbox", "value": "error", "description": "iframe 组件必须添加 sandbox 属性", "reason": "", "badExample": "import React from 'react';\n\nconst Frame = () => (\n <div>\n eslint(react/iframe-missing-sandbox)\"><iframe></iframe>\n {eslint(react/iframe-missing-sandbox)\">React.createElement('iframe')}\n </div>\n);", "goodExample": "import React from 'react';\n\nconst Frame1 = <iframe sandbox=\"allow-popups\" />;\nconst Frame2 = () => (\n <div>\n <iframe sandbox=\"allow-popups\"></iframe>\n {React.createElement('iframe', { sandbox: 'allow-popups' })}\n </div>\n);", "fixable": false, "extendsBaseRule": "", "requiresTypeChecking": false }, "react/jsx-boolean-value": { "name": "react/jsx-boolean-value", "value": "off", "description": "布尔值的属性必须显式的声明值为 true", "reason": "", "badExample": "", "goodExample": "", "fixable": true, "extendsBaseRule": "", "requiresTypeChecking": false }, "react/jsx-curly-brace-presence": { "name": "react/jsx-curly-brace-presence", "value": ["error", "never"], "description": "禁止 jsx 中使用无用的引号", "reason": "", "badExample": "<App prop=eslint(react/jsx-curly-brace-presence)\">{'foo'}>eslint(react/jsx-curly-brace-presence)\">{'Hello World'}</App>;", "goodExample": "<App prop=\"foo\">Hello World</App>;", "fixable": true, "extendsBaseRule": "", "requiresTypeChecking": false }, "react/jsx-filename-extension": { "name": "react/jsx-filename-extension", "value": "off", "description": "限制文件后缀", "reason": "", "badExample": "", "goodExample": "", "fixable": false, "extendsBaseRule": "", "requiresTypeChecking": false }, "react/jsx-fragments": { "name": "react/jsx-fragments", "value": ["error", "syntax"], "description": "必须使用 <></> 而不是 React.Fragment", "reason": "<></> 不需要额外引入 Fragment 组件", "badExample": "eslint(react/jsx-fragments)\"><React.Fragment></React.Fragment>;", "goodExample": "<></>;\n\n<div>\n {[1, 2, 3].map((value) => (\n <React.Fragment key={value}>{value}</React.Fragment>\n ))}\n</div>;", "fixable": true, "extendsBaseRule": "", "requiresTypeChecking": false }, "react/jsx-handler-names": { "name": "react/jsx-handler-names", "value": "off", "description": "handler 的名称必须是 onXXX 或 handleXXX", "reason": "", "badExample": "", "goodExample": "", "fixable": false, "extendsBaseRule": "", "requiresTypeChecking": false }, "react/jsx-key": { "name": "react/jsx-key", "value": ["error", { "checkFragmentShorthand": true }], "description": "数组中的 jsx 必须有 key", "reason": "", "badExample": "<ul>\n {[1, 2, 3].map((value) => (\n eslint(react/jsx-key)\"><li>{value}</li>\n ))}\n</ul>;\n<div>\n {[1, 2, 3].map((value) => (\n eslint(react/jsx-key)\"><>{value}</>\n ))}\n</div>;", "goodExample": "<ul>\n {[1, 2, 3].map((value) => (\n <li key={value}>{value}</li>\n ))}\n</ul>;\n<div>\n {[1, 2, 3].map((value) => (\n <React.Fragment key={value}>{value}</React.Fragment>\n ))}\n</div>;", "fixable": false, "extendsBaseRule": "", "requiresTypeChecking": false }, "react/jsx-max-depth": { "name": "react/jsx-max-depth", "value": "off", "description": "限制 jsx 层级", "reason": "", "badExample": "", "goodExample": "", "fixable": false, "extendsBaseRule": "", "requiresTypeChecking": false }, "react/jsx-no-bind": { "name": "react/jsx-no-bind", "value": "off", "description": "jsx 中禁止使用 bind", "reason": "", "badExample": "", "goodExample": "", "fixable": false, "extendsBaseRule": "", "requiresTypeChecking": false }, "react/jsx-no-comment-textnodes": { "name": "react/jsx-no-comment-textnodes", "value": "error", "description": "禁止在 jsx 中使用像注释的字符串", "reason": "", "badExample": "<div>eslint(react/jsx-no-comment-textnodes)\">// empty div</div>;\n<div>eslint(react/jsx-no-comment-textnodes)\">/* empty div */</div>;\n", "goodExample": "<div>{/* empty div */}</div>;\n<div /* empty div */ />;", "fixable": false, "extendsBaseRule": "", "requiresTypeChecking": false }, "react/jsx-no-constructed-context-values": { "name": "react/jsx-no-constructed-context-values", "value": "error", "description": "禁止使用不稳定的值作为 Context.Provider 的 value", "reason": "", "badExample": "function Foo() {\n return <Bar.Provider value={eslint(react/jsx-no-constructed-context-values)\">{ foo: 'bar' }}>Bar</Bar.Provider>;\n}", "goodExample": "function Foo() {\n const foo = useMemo(() => ({ foo: 'bar' }), []);\n return <Bar.Provider value={foo}>Bar</Bar.Provider>;\n}", "fixable": false, "extendsBaseRule": "", "requiresTypeChecking": false }, "react/jsx-no-duplicate-props": { "name": "react/jsx-no-duplicate-props", "value": "error", "description": "禁止出现重复的 props", "reason": "", "badExample": "<Foo name=\"foo\" eslint(react/jsx-no-duplicate-props)\">name=\"bar\" />;", "goodExample": "<Foo name=\"foo\" />;", "fixable": false, "extendsBaseRule": "", "requiresTypeChecking": false }, "react/jsx-no-leaked-render": { "name": "react/jsx-no-leaked-render", "value": "off", "description": "使用 && 渲染组件时，禁止条件是 0 '' 或 NaN", "reason": "", "badExample": "", "goodExample": "", "fixable": true, "extendsBaseRule": "", "requiresTypeChecking": false }, "react/jsx-no-literals": { "name": "react/jsx-no-literals", "value": "off", "description": "禁止在 jsx 中出现字符串", "reason": "", "badExample": "", "goodExample": "", "fixable": false, "extendsBaseRule": "", "requiresTypeChecking": false }, "react/jsx-no-script-url": { "name": "react/jsx-no-script-url", "value": "error", "description": "禁止出现 href=\"javascript:void(0)\"", "reason": "React 已经有 warning 了，并且会在将来禁止此类属性值", "badExample": "<a <mark class=\"eslint-error\" data-tip=\"A future version of React will block javascript: URLs as a security precaution. Use event handlers instead if you can. If you need to generate unsafe HTML, try using dangerouslySetInnerHTML instead. eslint(react/jsx-no-script-url)\">href=\"javascript:void(0);\"></a>;", "goodExample": "<a\n href=\"#\"\n onClick={(e) => {\n e.preventDefault();\n }}\n></a>;", "fixable": false, "extendsBaseRule": "", "requiresTypeChecking": false }, "react/jsx-no-target-blank": { "name": "react/jsx-no-target-blank", "value": "off", "description": "禁止使用 target=\"_blank\"", "reason": "", "badExample": "", "goodExample": "", "fixable": true, "extendsBaseRule": "", "requiresTypeChecking": false }, "react/jsx-no-undef": { "name": "react/jsx-no-undef", "value": "error", "description": "禁止使用未定义的组件", "reason": "", "badExample": "<eslint(react/jsx-no-undef)\">Foo />;", "goodExample": "import Foo from './Foo';\n<Foo />;", "fixable": false, "extendsBaseRule": "", "requiresTypeChecking": false }, "react/jsx-no-useless-fragment": { "name": "react/jsx-no-useless-fragment", "value": "error", "description": "禁止无意义的 Fragment 组件", "reason": "", "badExample": "eslint(react/jsx-no-useless-fragment)\"><></>;\neslint(react/jsx-no-useless-fragment)\"><>\n <Foo />\n</>;", "goodExample": "<>foo</>;\n<React.Fragment key=\"foo\">\n <Foo />\n</React.Fragment>;", "fixable": true, "extendsBaseRule": "", "requiresTypeChecking": false }, "react/jsx-pascal-case": { "name": "react/jsx-pascal-case", "value": "error", "description": "组件的名称必须符合 PascalCase", "reason": "", "badExample": "eslint(react/jsx-pascal-case)\"><FOO />;\neslint(react/jsx-pascal-case)\"><FOO_BAR />;", "goodExample": "<Foo />;\n<FooBar />;", "fixable": false, "extendsBaseRule": "", "requiresTypeChecking": false }, "react/jsx-props-no-spreading": { "name": "react/jsx-props-no-spreading", "value": "off", "description": "禁止使用 {...props}", "reason": "", "badExample": "", "goodExample": "", "fixable": false, "extendsBaseRule": "", "requiresTypeChecking": false }, "react/jsx-sort-props": { "name": "react/jsx-sort-props", "value": "off", "description": "props 必须按字母排序", "reason": "", "badExample": "", "goodExample": "", "fixable": true, "extendsBaseRule": "", "requiresTypeChecking": false }, "react/jsx-uses-react": { "name": "react/jsx-uses-react", "value": "error", "description": "修复 React 被误报为未使用的变量的问题（仅在开启 no-unused-vars 时有效）", "reason": "", "badExample": "/* eslint no-unused-vars: \"error\", react/jsx-uses-react: \"off\" */\nimport eslint(no-unused-vars)\">React from 'react';\n\n<div />;", "goodExample": "/* eslint no-unused-vars: \"error\" */\nimport React from 'react';\n\n<div />;", "fixable": false, "extendsBaseRule": "", "requiresTypeChecking": false }, "react/jsx-uses-vars": { "name": "react/jsx-uses-vars", "value": "error", "description": "修复 no-unused-vars 不检查 jsx 的问题", "reason": "", "badExample": "/* eslint no-unused-vars: \"error\", \"react/jsx-uses-vars\": \"off\" */\nimport eslint(no-unused-vars)\">Foo from './Foo';\n\n<Foo />;", "goodExample": "/* eslint no-unused-vars: \"error\" */\nimport Foo from './Foo';\n\n<Foo />;", "fixable": false, "extendsBaseRule": "", "requiresTypeChecking": false }, "react/no-access-state-in-setstate": { "name": "react/no-access-state-in-setstate", "value": "off", "description": "禁止在 setState 中使用 this.state", "reason": "", "badExample": "", "goodExample": "", "fixable": false, "extendsBaseRule": "", "requiresTypeChecking": false }, "react/no-adjacent-inline-elements": { "name": "react/no-adjacent-inline-elements", "value": "off", "description": "两个 inline 元素之间必须有空格，否则视觉上它们就贴在一起了", "reason": "这是样式的问题，不应该由空格约束", "badExample": "", "goodExample": "", "fixable": false, "extendsBaseRule": "", "requiresTypeChecking": false }, "react/no-array-index-key": { "name": "react/no-array-index-key", "value": "off", "description": "禁止使用数组的索引作为 key", "reason": "", "badExample": "", "goodExample": "", "fixable": false, "extendsBaseRule": "", "requiresTypeChecking": false }, "react/no-arrow-function-lifecycle": { "name": "react/no-arrow-function-lifecycle", "value": "off", "description": "类组件中的生命周期函数不要使用箭头函数", "reason": "", "badExample": "", "goodExample": "", "fixable": true, "extendsBaseRule": "", "requiresTypeChecking": false }, "react/no-children-prop": { "name": "react/no-children-prop", "value": "error", "description": "禁止将 children 作为一个 prop", "reason": "", "badExample": "<div eslint(react/no-children-prop)\">children=\"Hello World\" />;\n<Foo eslint(react/no-children-prop)\">children={<Bar />} />;", "goodExample": "<div>Hello World</div>;\n<Foo>\n <Bar />\n</Foo>;", "fixable": false, "extendsBaseRule": "", "requiresTypeChecking": false }, "react/no-danger": { "name": "react/no-danger", "value": "off", "description": "禁止使用 dangerouslySetInnerHTML", "reason": "", "badExample": "", "goodExample": "", "fixable": false, "extendsBaseRule": "", "requiresTypeChecking": false }, "react/no-danger-with-children": { "name": "react/no-danger-with-children", "value": "error", "description": "禁止在使用了 dangerouslySetInnerHTML 的组件内添加 children", "reason": "", "badExample": "eslint(react/no-danger-with-children)\"><div dangerouslySetInnerHTML={{ __html: 'Foo' }}>Hello World</div>;", "goodExample": "<div dangerouslySetInnerHTML={{ __html: 'Foo' <span class=\"token punctuation