diff --git a/docs/rules/display-name.md b/docs/rules/display-name.md index 91f60eda60..6eca43e986 100644 --- a/docs/rules/display-name.md +++ b/docs/rules/display-name.md @@ -1,4 +1,4 @@ -# Prevent missing displayName in a React component definition (display-name) +# Prevent missing displayName in a React component definition (react/display-name) DisplayName allows you to name your component. This name is used by React in debugging messages. diff --git a/docs/rules/forbid-component-props.md b/docs/rules/forbid-component-props.md index 737f58ecf2..a9da8a9f2d 100644 --- a/docs/rules/forbid-component-props.md +++ b/docs/rules/forbid-component-props.md @@ -1,4 +1,4 @@ -# Forbid certain props on Components (forbid-component-props) +# Forbid certain props on Components (react/forbid-component-props) By default this rule prevents passing of [props that add lots of complexity](https://medium.com/brigade-engineering/don-t-pass-css-classes-between-components-e9f7ab192785) (`className`, `style`) to Components. This rule only applies to Components (e.g. ``) and not DOM nodes (e.g. `
`). The list of forbidden props can be customized with the `forbid` option. diff --git a/docs/rules/forbid-elements.md b/docs/rules/forbid-elements.md index 951d990205..4d3bf17ac3 100644 --- a/docs/rules/forbid-elements.md +++ b/docs/rules/forbid-elements.md @@ -1,4 +1,4 @@ -# Forbid certain elements (forbid-elements) +# Forbid certain elements (react/forbid-elements) You may want to forbid usage of certain elements in favor of others, (e.g. forbid all `
` and use `` instead). This rule allows you to configure a list of forbidden elements and to specify their desired replacements. diff --git a/docs/rules/forbid-foreign-prop-types.md b/docs/rules/forbid-foreign-prop-types.md index 1973c92af3..9d9681e640 100644 --- a/docs/rules/forbid-foreign-prop-types.md +++ b/docs/rules/forbid-foreign-prop-types.md @@ -1,4 +1,4 @@ -# Forbid foreign propTypes (forbid-foreign-prop-types) +# Forbid foreign propTypes (react/forbid-foreign-prop-types) This rule forbids using another component's prop types unless they are explicitly imported/exported. This allows people who want to use [babel-plugin-transform-react-remove-prop-types](https://github.com/oliviertassinari/babel-plugin-transform-react-remove-prop-types) to remove propTypes from their components in production builds, to do so safely. diff --git a/docs/rules/forbid-prop-types.md b/docs/rules/forbid-prop-types.md index e8c96c2c7f..951285ce3b 100644 --- a/docs/rules/forbid-prop-types.md +++ b/docs/rules/forbid-prop-types.md @@ -1,4 +1,4 @@ -# Forbid certain propTypes (forbid-prop-types) +# Forbid certain propTypes (react/forbid-prop-types) By default this rule prevents vague prop types with more specific alternatives available (`any`, `array`, `object`), but any prop type can be disabled if desired. The defaults are chosen because they have obvious replacements. `any` should be replaced with, well, anything. `array` and `object` can be replaced with `arrayOf` and `shape`, respectively. diff --git a/docs/rules/jsx-boolean-value.md b/docs/rules/jsx-boolean-value.md index c3ad2ec677..5dcfabe9e3 100644 --- a/docs/rules/jsx-boolean-value.md +++ b/docs/rules/jsx-boolean-value.md @@ -1,4 +1,4 @@ -# Enforce boolean attributes notation in JSX (jsx-boolean-value) +# Enforce boolean attributes notation in JSX (react/jsx-boolean-value) [When using a boolean attribute in JSX](https://facebook.github.io/react/docs/jsx-in-depth.html#boolean-attributes), you can set the attribute value to `true` or omit the value. This rule will enforce one or the other to keep consistency in your code. diff --git a/docs/rules/jsx-closing-bracket-location.md b/docs/rules/jsx-closing-bracket-location.md index 67d3dd5687..ae183775d1 100644 --- a/docs/rules/jsx-closing-bracket-location.md +++ b/docs/rules/jsx-closing-bracket-location.md @@ -1,4 +1,4 @@ -# Validate closing bracket location in JSX (jsx-closing-bracket-location) +# Validate closing bracket location in JSX (react/jsx-closing-bracket-location) Enforce the closing bracket location for JSX multiline elements. @@ -71,7 +71,7 @@ The following patterns are considered warnings: // 'jsx-closing-bracket-location': 1 // 'jsx-closing-bracket-location': [1, 'tag-aligned'] // 'jsx-closing-bracket-location': [1, 'line-aligned'] -; @@ -114,7 +114,7 @@ var x = function() { }; // 'jsx-closing-bracket-location': [1, 'after-props'] -; @@ -127,7 +127,7 @@ var x = function() { ; // 'jsx-closing-bracket-location': [1, 'props-aligned'] -; @@ -188,7 +188,7 @@ var x = function() { }; // 'jsx-closing-bracket-location': [1, {selfClosing: 'after-props'}] -; @@ -200,7 +200,7 @@ var x = function() { ; // 'jsx-closing-bracket-location': [1, {selfClosing: 'props-aligned', nonEmpty: 'after-props'}] -; diff --git a/docs/rules/jsx-curly-spacing.md b/docs/rules/jsx-curly-spacing.md index 6dd65d4731..471f276e8e 100644 --- a/docs/rules/jsx-curly-spacing.md +++ b/docs/rules/jsx-curly-spacing.md @@ -1,4 +1,4 @@ -# Enforce or disallow spaces inside of curly braces in JSX attributes. (jsx-curly-spacing) +# Enforce or disallow spaces inside of curly braces in JSX attributes. (react/jsx-curly-spacing) While formatting preferences are very personal, a number of style guides require or disallow spaces between curly braces. diff --git a/docs/rules/jsx-equals-spacing.md b/docs/rules/jsx-equals-spacing.md index fd66cf6a91..a97cad95e7 100644 --- a/docs/rules/jsx-equals-spacing.md +++ b/docs/rules/jsx-equals-spacing.md @@ -1,4 +1,4 @@ -# Enforce or disallow spaces around equal signs in JSX attributes. (jsx-equals-spacing) +# Enforce or disallow spaces around equal signs in JSX attributes. (react/jsx-equals-spacing) Some style guides require or disallow spaces around equal signs. diff --git a/docs/rules/jsx-filename-extension.md b/docs/rules/jsx-filename-extension.md index ef5d98cb53..6131b5ca5e 100644 --- a/docs/rules/jsx-filename-extension.md +++ b/docs/rules/jsx-filename-extension.md @@ -1,4 +1,4 @@ -# Restrict file extensions that may contain JSX (jsx-filename-extension) +# Restrict file extensions that may contain JSX (react/jsx-filename-extension) ## Rule Details diff --git a/docs/rules/jsx-first-prop-new-line.md b/docs/rules/jsx-first-prop-new-line.md index dd3bcd3644..50b8eef4bd 100644 --- a/docs/rules/jsx-first-prop-new-line.md +++ b/docs/rules/jsx-first-prop-new-line.md @@ -1,4 +1,4 @@ -# Configure the position of the first property (jsx-first-prop-new-line) +# Configure the position of the first property (react/jsx-first-prop-new-line) Ensure correct position of the first property. diff --git a/docs/rules/jsx-handler-names.md b/docs/rules/jsx-handler-names.md index 12dcdcbde9..4b4b4c0ab7 100644 --- a/docs/rules/jsx-handler-names.md +++ b/docs/rules/jsx-handler-names.md @@ -1,4 +1,4 @@ -# Enforce event handler naming conventions in JSX (jsx-handler-names) +# Enforce event handler naming conventions in JSX (react/jsx-handler-names) Ensures that any component or prop methods used to handle events are correctly prefixed. diff --git a/docs/rules/jsx-indent-props.md b/docs/rules/jsx-indent-props.md index ee6d77d94a..3467bddced 100644 --- a/docs/rules/jsx-indent-props.md +++ b/docs/rules/jsx-indent-props.md @@ -1,4 +1,4 @@ -# Validate props indentation in JSX (jsx-indent-props) +# Validate props indentation in JSX (react/jsx-indent-props) This option validates a specific indentation style for props. diff --git a/docs/rules/jsx-indent.md b/docs/rules/jsx-indent.md index 909c5818f1..492d60f6c6 100644 --- a/docs/rules/jsx-indent.md +++ b/docs/rules/jsx-indent.md @@ -1,4 +1,4 @@ -# Validate JSX indentation (jsx-indent) +# Validate JSX indentation (react/jsx-indent) This option validates a specific indentation style for JSX. diff --git a/docs/rules/jsx-key.md b/docs/rules/jsx-key.md index 8746105bd1..60c4ca3edb 100644 --- a/docs/rules/jsx-key.md +++ b/docs/rules/jsx-key.md @@ -1,4 +1,4 @@ -# Detect missing `key` prop (jsx-key) +# Detect missing `key` prop (react/jsx-key) Warn if an element that likely requires a `key` prop--namely, one present in an array literal or an arrow function expression. diff --git a/docs/rules/jsx-max-props-per-line.md b/docs/rules/jsx-max-props-per-line.md index 4baaf90e14..6857162503 100644 --- a/docs/rules/jsx-max-props-per-line.md +++ b/docs/rules/jsx-max-props-per-line.md @@ -1,4 +1,4 @@ -# Limit maximum of props on a single line in JSX (jsx-max-props-per-line) +# Limit maximum of props on a single line in JSX (react/jsx-max-props-per-line) Limiting the maximum of props on a single line can improve readability. @@ -76,9 +76,9 @@ The following patterns are not considered warnings: ```jsx // [1, { "when": "multiline" }] - ``` diff --git a/docs/rules/jsx-no-bind.md b/docs/rules/jsx-no-bind.md index 6ccfb49353..1fad990f08 100644 --- a/docs/rules/jsx-no-bind.md +++ b/docs/rules/jsx-no-bind.md @@ -1,4 +1,4 @@ -# No `.bind()` or Arrow Functions in JSX Props (jsx-no-bind) +# No `.bind()` or Arrow Functions in JSX Props (react/jsx-no-bind) A `bind` call or [arrow function](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Arrow_functions) in a JSX prop will create a brand new function on every single render. This is bad for performance, as it will result in the garbage collector being invoked way more than is necessary. diff --git a/docs/rules/jsx-no-comment-textnodes.md b/docs/rules/jsx-no-comment-textnodes.md index f5b57ab16f..24b19f90da 100644 --- a/docs/rules/jsx-no-comment-textnodes.md +++ b/docs/rules/jsx-no-comment-textnodes.md @@ -1,4 +1,4 @@ -# Prevent comments from being inserted as text nodes (jsx-no-comment-textnodes) +# Prevent comments from being inserted as text nodes (react/jsx-no-comment-textnodes) This rule prevents comment strings (e.g. beginning with `//` or `/*`) from being accidentally injected as a text node in JSX statements. diff --git a/docs/rules/jsx-no-duplicate-props.md b/docs/rules/jsx-no-duplicate-props.md index 52e4dd7dd2..cb0d1c8fe0 100644 --- a/docs/rules/jsx-no-duplicate-props.md +++ b/docs/rules/jsx-no-duplicate-props.md @@ -1,4 +1,4 @@ -# Prevent duplicate properties in JSX (jsx-no-duplicate-props) +# Prevent duplicate properties in JSX (react/jsx-no-duplicate-props) Creating JSX elements with duplicate props can cause unexpected behavior in your application. diff --git a/docs/rules/jsx-no-literals.md b/docs/rules/jsx-no-literals.md index 3c23c1fd64..b1afd3c31d 100644 --- a/docs/rules/jsx-no-literals.md +++ b/docs/rules/jsx-no-literals.md @@ -1,4 +1,4 @@ -# Prevent usage of unwrapped JSX strings (jsx-no-literals) +# Prevent usage of unwrapped JSX strings (react/jsx-no-literals) In JSX when using a literal string you can wrap it in a JSX container `{'TEXT'}`. This rules requires that you wrap all literal strings. diff --git a/docs/rules/jsx-no-target-blank.md b/docs/rules/jsx-no-target-blank.md index 1b221db560..52fcfaaef8 100644 --- a/docs/rules/jsx-no-target-blank.md +++ b/docs/rules/jsx-no-target-blank.md @@ -1,4 +1,4 @@ -# Prevent usage of unsafe `target='_blank'` (jsx-no-target-blank) +# Prevent usage of unsafe `target='_blank'` (react/jsx-no-target-blank) When creating a JSX element that has an a tag, it is often desired to have the link open in a new tab using the `target='_blank'` attribute. Using this diff --git a/docs/rules/jsx-no-undef.md b/docs/rules/jsx-no-undef.md index 63e927e64d..9e244d8cb8 100644 --- a/docs/rules/jsx-no-undef.md +++ b/docs/rules/jsx-no-undef.md @@ -1,4 +1,4 @@ -# Disallow undeclared variables in JSX (jsx-no-undef) +# Disallow undeclared variables in JSX (react/jsx-no-undef) This rule helps locate potential ReferenceErrors resulting from misspellings or missing components. diff --git a/docs/rules/jsx-pascal-case.md b/docs/rules/jsx-pascal-case.md index 08dcb3a996..5a3456d813 100644 --- a/docs/rules/jsx-pascal-case.md +++ b/docs/rules/jsx-pascal-case.md @@ -1,4 +1,4 @@ -# Enforce PascalCase for user-defined JSX components (jsx-pascal-case) +# Enforce PascalCase for user-defined JSX components (react/jsx-pascal-case) Enforces coding style that user-defined JSX components are defined and referenced in PascalCase. diff --git a/docs/rules/jsx-sort-props.md b/docs/rules/jsx-sort-props.md index b06747f935..c0a1401948 100644 --- a/docs/rules/jsx-sort-props.md +++ b/docs/rules/jsx-sort-props.md @@ -1,4 +1,4 @@ -# Enforce props alphabetical sorting (jsx-sort-props) +# Enforce props alphabetical sorting (react/jsx-sort-props) Some developers prefer to sort props names alphabetically to be able to find necessary props easier at the later time. Others feel that it adds complexity and becomes burden to maintain. diff --git a/docs/rules/jsx-space-before-closing.md b/docs/rules/jsx-space-before-closing.md index d9d6b45d69..a888b7c0fe 100644 --- a/docs/rules/jsx-space-before-closing.md +++ b/docs/rules/jsx-space-before-closing.md @@ -1,4 +1,4 @@ -# Validate spacing before closing bracket in JSX (jsx-space-before-closing) +# Validate spacing before closing bracket in JSX (react/jsx-space-before-closing) **Deprecation notice**: This rule is deprecated. Please use the `"beforeSelfClosing"` option of the [jsx-tag-spacing](https://github.com/yannickcr/eslint-plugin-react/blob/master/docs/rules/jsx-tag-spacing.md) rule instead. diff --git a/docs/rules/jsx-tag-spacing.md b/docs/rules/jsx-tag-spacing.md index 31d20fe448..0e16824288 100644 --- a/docs/rules/jsx-tag-spacing.md +++ b/docs/rules/jsx-tag-spacing.md @@ -1,4 +1,4 @@ -# Validate whitespace in and around the JSX opening and closing brackets (jsx-tag-spacing) +# Validate whitespace in and around the JSX opening and closing brackets (react/jsx-tag-spacing) Enforce or forbid spaces after the opening bracket, before the closing bracket of self-closing elements, and between the angle bracket and slash of JSX closing or self-closing elements. diff --git a/docs/rules/jsx-uses-react.md b/docs/rules/jsx-uses-react.md index c2a941dddc..b1c45fab75 100644 --- a/docs/rules/jsx-uses-react.md +++ b/docs/rules/jsx-uses-react.md @@ -1,4 +1,4 @@ -# Prevent React to be incorrectly marked as unused (jsx-uses-react) +# Prevent React to be incorrectly marked as unused (react/jsx-uses-react) JSX expands to a call to `React.createElement`, a file which includes `React` but only uses JSX should consider the `React` variable as used. diff --git a/docs/rules/jsx-uses-vars.md b/docs/rules/jsx-uses-vars.md index d60dab4e46..fd20e1dfb0 100644 --- a/docs/rules/jsx-uses-vars.md +++ b/docs/rules/jsx-uses-vars.md @@ -1,4 +1,4 @@ -# Prevent variables used in JSX to be incorrectly marked as unused (jsx-uses-vars) +# Prevent variables used in JSX to be incorrectly marked as unused (react/jsx-uses-vars) Since 0.17.0 the ESLint `no-unused-vars` rule does not detect variables used in JSX ([see details](http://eslint.org/blog/2015/03/eslint-0.17.0-released#changes-to-jsxreact-handling)). This rule will find variables used in JSX and mark them as used. diff --git a/docs/rules/jsx-wrap-multilines.md b/docs/rules/jsx-wrap-multilines.md index a3f24c4d35..0983f4a329 100644 --- a/docs/rules/jsx-wrap-multilines.md +++ b/docs/rules/jsx-wrap-multilines.md @@ -1,4 +1,4 @@ -# Prevent missing parentheses around multiline JSX (jsx-wrap-multilines) +# Prevent missing parentheses around multiline JSX (react/jsx-wrap-multilines) Wrapping multiline JSX in parentheses can improve readability and/or convenience. It optionally takes a second parameter in the form of an object, containing places to apply the rule. By default, `"declaration"`, `"assignment"`, `"return"`, and `"arrow"` syntax is checked, but these can be explicitly disabled. Any syntax type missing in the object will follow the default behavior (become enabled). diff --git a/docs/rules/no-array-index-key.md b/docs/rules/no-array-index-key.md index 86eb2ac800..7645b51ac0 100644 --- a/docs/rules/no-array-index-key.md +++ b/docs/rules/no-array-index-key.md @@ -1,4 +1,4 @@ -# Prevent usage of Array index in keys +# Prevent usage of Array index in keys (react/no-array-index-key) Warn if an element uses an Array index in its `key`. diff --git a/docs/rules/no-children-prop.md b/docs/rules/no-children-prop.md index e49c7d8715..dc26f027ae 100644 --- a/docs/rules/no-children-prop.md +++ b/docs/rules/no-children-prop.md @@ -1,4 +1,4 @@ -# Prevent passing of children as props (no-children-prop) +# Prevent passing of children as props (react/no-children-prop) Children should always be actual children, not passed in as a prop. diff --git a/docs/rules/no-danger-with-children.md b/docs/rules/no-danger-with-children.md index bb21a035dc..673ab5afe7 100644 --- a/docs/rules/no-danger-with-children.md +++ b/docs/rules/no-danger-with-children.md @@ -1,4 +1,4 @@ -# Prevent problem with children and props.dangerouslySetInnerHTML (no-danger-with-children) +# Prevent problem with children and props.dangerouslySetInnerHTML (react/no-danger-with-children) This rule helps prevent problems caused by using children and the dangerouslySetInnerHTML prop at the same time. React will throw a warning if this rule is ignored. diff --git a/docs/rules/no-danger.md b/docs/rules/no-danger.md index 0e8c382afa..b1dfe3b484 100644 --- a/docs/rules/no-danger.md +++ b/docs/rules/no-danger.md @@ -1,4 +1,4 @@ -# Prevent usage of dangerous JSX properties (no-danger) +# Prevent usage of dangerous JSX properties (react/no-danger) Dangerous properties in React are those whose behavior is known to be a common source of application vulnerabilities. The properties names clearly indicate they are dangerous and should be avoided unless great care is taken. diff --git a/docs/rules/no-deprecated.md b/docs/rules/no-deprecated.md index 5be4865d39..82b8b540db 100644 --- a/docs/rules/no-deprecated.md +++ b/docs/rules/no-deprecated.md @@ -1,4 +1,4 @@ -# Prevent usage of deprecated methods (no-deprecated) +# Prevent usage of deprecated methods (react/no-deprecated) Several methods are deprecated between React versions. This rule will warn you if you try to use a deprecated method. Use the [shared settings](/README.md#configuration) to specify the React version. diff --git a/docs/rules/no-did-mount-set-state.md b/docs/rules/no-did-mount-set-state.md index 06b263d988..0cefc284b3 100644 --- a/docs/rules/no-did-mount-set-state.md +++ b/docs/rules/no-did-mount-set-state.md @@ -1,4 +1,4 @@ -# Prevent usage of setState in componentDidMount (no-did-mount-set-state) +# Prevent usage of setState in componentDidMount (react/no-did-mount-set-state) Updating the state after a component mount will trigger a second `render()` call and can lead to property/layout thrashing. diff --git a/docs/rules/no-did-update-set-state.md b/docs/rules/no-did-update-set-state.md index cfbc0c58eb..0a82442f6e 100644 --- a/docs/rules/no-did-update-set-state.md +++ b/docs/rules/no-did-update-set-state.md @@ -1,4 +1,4 @@ -# Prevent usage of setState in componentDidUpdate (no-did-update-set-state) +# Prevent usage of setState in componentDidUpdate (react/no-did-update-set-state) Updating the state after a component update will trigger a second `render()` call and can lead to property/layout thrashing. diff --git a/docs/rules/no-direct-mutation-state.md b/docs/rules/no-direct-mutation-state.md index 62de174511..da0dbf5d72 100644 --- a/docs/rules/no-direct-mutation-state.md +++ b/docs/rules/no-direct-mutation-state.md @@ -1,4 +1,4 @@ -# Prevent direct mutation of this.state (no-direct-mutation-state) +# Prevent direct mutation of this.state (react/no-direct-mutation-state) NEVER mutate `this.state` directly, as calling `setState()` afterwards may replace the mutation you made. Treat `this.state` as if it were immutable. diff --git a/docs/rules/no-find-dom-node.md b/docs/rules/no-find-dom-node.md index e962db0667..8af82522b3 100644 --- a/docs/rules/no-find-dom-node.md +++ b/docs/rules/no-find-dom-node.md @@ -1,4 +1,4 @@ -# Prevent usage of findDOMNode (no-find-dom-node) +# Prevent usage of findDOMNode (react/no-find-dom-node) Facebook will eventually deprecate `findDOMNode` as it blocks certain improvements in React in the future. diff --git a/docs/rules/no-is-mounted.md b/docs/rules/no-is-mounted.md index 35858fd1dc..b2931e1d1e 100644 --- a/docs/rules/no-is-mounted.md +++ b/docs/rules/no-is-mounted.md @@ -1,4 +1,4 @@ -# Prevent usage of isMounted (no-is-mounted) +# Prevent usage of isMounted (react/no-is-mounted) [`isMounted` is an anti-pattern][anti-pattern], is not available when using ES6 classes, and it is on its way to being officially deprecated. diff --git a/docs/rules/no-multi-comp.md b/docs/rules/no-multi-comp.md index 95490f6ec9..0293fc78ed 100644 --- a/docs/rules/no-multi-comp.md +++ b/docs/rules/no-multi-comp.md @@ -1,4 +1,4 @@ -# Prevent multiple component definition per file (no-multi-comp) +# Prevent multiple component definition per file (react/no-multi-comp) Declaring only one component per file improves readability and reusability of components. diff --git a/docs/rules/no-render-return-value.md b/docs/rules/no-render-return-value.md index 12ef6c767e..fc49cd38cc 100644 --- a/docs/rules/no-render-return-value.md +++ b/docs/rules/no-render-return-value.md @@ -1,4 +1,4 @@ -# Prevent usage of the return value of React.render (no-render-return-value) +# Prevent usage of the return value of React.render (react/no-render-return-value) > `ReactDOM.render()` currently returns a reference to the root `ReactComponent` instance. However, using this return value is legacy and should be avoided because future versions of React may render components asynchronously in some cases. If you need a reference to the root `ReactComponent` instance, the preferred solution is to attach a [callback ref](http://facebook.github.io/react/docs/more-about-refs.html#the-ref-callback-attribute) to the root element. diff --git a/docs/rules/no-set-state.md b/docs/rules/no-set-state.md index ed07a78591..7de61e75ff 100644 --- a/docs/rules/no-set-state.md +++ b/docs/rules/no-set-state.md @@ -1,4 +1,4 @@ -# Prevent usage of setState (no-set-state) +# Prevent usage of setState (react/no-set-state) When using an architecture that separates your application state from your UI components (e.g. Flux), it may be desirable to forbid the use of local component state. This rule is especially helpful in read-only applications (that don't use forms), since local component state should rarely be necessary in such cases. diff --git a/docs/rules/no-string-refs.md b/docs/rules/no-string-refs.md index c1bc29d67d..359a5ab102 100644 --- a/docs/rules/no-string-refs.md +++ b/docs/rules/no-string-refs.md @@ -1,4 +1,4 @@ -# Prevent using string references (no-string-refs) +# Prevent using string references (react/no-string-refs) Currently, two ways are supported by React to refer to components. The first way, providing a string identifier, is now considered legacy in the official documentation. The documentation now prefers a second method -- referring to components by setting a property on the `this` object in the reference callback. diff --git a/docs/rules/no-unescaped-entities.md b/docs/rules/no-unescaped-entities.md index 2040d2c07c..a22339b2f3 100644 --- a/docs/rules/no-unescaped-entities.md +++ b/docs/rules/no-unescaped-entities.md @@ -1,6 +1,6 @@ -# Prevent invalid characters from appearing in markup (no-unescaped-entities) +# Prevent invalid characters from appearing in markup (react/no-unescaped-entities) -This rule prevents characters that you may have meant as JSX escape characters +This rule prevents characters that you may have meant as JSX escape characters from being accidentally injected as a text node in JSX statements. For example, if one were to misplace their closing `>` in a tag: @@ -27,7 +27,7 @@ Another example is when one accidentally includes an extra closing brace. The extra brace will be rendered, and the body text will be `Text}`. -This rule will also check for `"` and `'`, which might be accidentally included +This rule will also check for `"` and `'`, which might be accidentally included when the closing `>` is in the wrong place. ```jsx diff --git a/docs/rules/no-unknown-property.md b/docs/rules/no-unknown-property.md index 6e54499242..67f5192205 100644 --- a/docs/rules/no-unknown-property.md +++ b/docs/rules/no-unknown-property.md @@ -1,4 +1,4 @@ -# Prevent usage of unknown DOM property (no-unknown-property) +# Prevent usage of unknown DOM property (react/no-unknown-property) In JSX all DOM properties and attributes should be camelCased to be consistent with standard JavaScript style. This can be a possible source of error if you are used to writing plain HTML. diff --git a/docs/rules/no-unused-prop-types.md b/docs/rules/no-unused-prop-types.md index f4982abdc7..52e50bc6ed 100644 --- a/docs/rules/no-unused-prop-types.md +++ b/docs/rules/no-unused-prop-types.md @@ -1,4 +1,4 @@ -# Prevent definitions of unused prop types (no-unused-prop-types) +# Prevent definitions of unused prop types (react/no-unused-prop-types) Warns you if you have defined a prop type but it is never being used anywhere. @@ -45,7 +45,7 @@ var Hello = createReactClass({ This rule can take one argument to ignore some specific props during validation. -``` +```js ... "react/no-unused-prop-types": [, { customValidators: , skipShapeProps: }] ... diff --git a/docs/rules/no-will-update-set-state.md b/docs/rules/no-will-update-set-state.md index 372cf57759..6225d2ccaa 100644 --- a/docs/rules/no-will-update-set-state.md +++ b/docs/rules/no-will-update-set-state.md @@ -1,4 +1,4 @@ -# Prevent usage of setState in componentWillUpdate (no-will-update-set-state) +# Prevent usage of setState in componentWillUpdate (react/no-will-update-set-state) Updating the state during the componentWillUpdate step can lead to indeterminate component state and is not allowed. diff --git a/docs/rules/prefer-es6-class.md b/docs/rules/prefer-es6-class.md index 929d0a89f0..3996a4a941 100644 --- a/docs/rules/prefer-es6-class.md +++ b/docs/rules/prefer-es6-class.md @@ -1,4 +1,4 @@ -# Enforce ES5 or ES6 class for React Components (prefer-es6-class) +# Enforce ES5 or ES6 class for React Components (react/prefer-es6-class) React offers you two way to create traditional components: using the ES5 `create-react-class` module or the new ES6 class system. This rule allow you to enforce one way or another. diff --git a/docs/rules/prefer-stateless-function.md b/docs/rules/prefer-stateless-function.md index 10d67d9e85..9386eceddb 100644 --- a/docs/rules/prefer-stateless-function.md +++ b/docs/rules/prefer-stateless-function.md @@ -1,4 +1,4 @@ -# Enforce stateless React Components to be written as a pure function (prefer-stateless-function) +# Enforce stateless React Components to be written as a pure function (react/prefer-stateless-function) Stateless functional components are simpler than class based components and will benefit from future React performance optimizations specific to these components. diff --git a/docs/rules/prop-types.md b/docs/rules/prop-types.md index 6819f8406b..05c8817fe0 100644 --- a/docs/rules/prop-types.md +++ b/docs/rules/prop-types.md @@ -1,4 +1,4 @@ -# Prevent missing props validation in a React component definition (prop-types) +# Prevent missing props validation in a React component definition (react/prop-types) PropTypes improve the reusability of your component by validating the received data. @@ -100,7 +100,7 @@ Hello.propTypes = { This rule can take one argument to ignore some specific props during validation. -``` +```js ... "react/prop-types": [, { ignore: , customValidators: }] ... diff --git a/docs/rules/react-in-jsx-scope.md b/docs/rules/react-in-jsx-scope.md index 551661bf9c..c6591b0301 100644 --- a/docs/rules/react-in-jsx-scope.md +++ b/docs/rules/react-in-jsx-scope.md @@ -1,4 +1,4 @@ -# Prevent missing React when using JSX (react-in-jsx-scope) +# Prevent missing React when using JSX (react/react-in-jsx-scope) When using JSX, `` expands to `React.createElement("a")`. Therefore the `React` variable must be in scope. diff --git a/docs/rules/require-default-props.md b/docs/rules/require-default-props.md index 9e137d0f93..ce1bf7060c 100644 --- a/docs/rules/require-default-props.md +++ b/docs/rules/require-default-props.md @@ -1,4 +1,4 @@ -# Enforce a defaultProps definition for every prop that is not a required prop (require-default-props) +# Enforce a defaultProps definition for every prop that is not a required prop (react/require-default-props) This rule aims to ensure that any non-required `PropType` declaration of a component has a corresponding `defaultProps` value. diff --git a/docs/rules/require-extension.md b/docs/rules/require-extension.md new file mode 100644 index 0000000000..a235088aab --- /dev/null +++ b/docs/rules/require-extension.md @@ -0,0 +1,48 @@ +# Restrict file extensions that may be required (react/require-extension) + +**Deprecation notice**: This rule is deprecated. Please use the eslint-plugin-import [extensions](https://github.com/benmosher/eslint-plugin-import/blob/master/docs/rules/extensions.md) rule instead. + +`require()` statements should generally not include a file extension as there is a well defined mechanism for resolving a module ID to a specific file. This rule inspects the module ID being required and creates a warning if the ID contains a '.jsx' file extension. + +Note: this rule does not prevent required files from containing these extensions, it merely prevents the extension from being included in the `require()` statement. + +## Rule Details + +The following patterns are considered warnings: + +```js +var index = require('./index.jsx'); + +// When [1, {extensions: ['.js']}] +var index = require('./index.js'); +``` + +The following patterns are not considered warnings: + +```js +var index = require('./index'); + +var eslint = require('eslint'); +``` + +## Rule Options + +The set of forbidden extensions is configurable. By default '.jsx' is blocked. If you wanted to forbid both '.jsx' and '.js', the configuration would be: + +```js +... +"react/require-extension": [1, { "extensions": [".js", ".jsx"] }], +... +``` + +To configure WebPack to resolve '.jsx' add the following to `webpack.config.js`: + +```js +resolve: { + extensions: ["", ".js", ".jsx"] +}, +``` + +## When Not To Use It + +If you have file in your project with a '.jsx' file extension and do not have `require()` configured to automatically resolve '.jsx' files. diff --git a/docs/rules/require-optimization.md b/docs/rules/require-optimization.md index 3c748a66db..bda590a7c3 100644 --- a/docs/rules/require-optimization.md +++ b/docs/rules/require-optimization.md @@ -1,4 +1,4 @@ -# Enforce React components to have a shouldComponentUpdate method (require-optimization) +# Enforce React components to have a shouldComponentUpdate method (react/require-optimization) This rule prevents you from creating React components without declaring a `shouldComponentUpdate` method. diff --git a/docs/rules/require-render-return.md b/docs/rules/require-render-return.md index 01650844c9..faf127b7fc 100644 --- a/docs/rules/require-render-return.md +++ b/docs/rules/require-render-return.md @@ -1,4 +1,4 @@ -# Enforce ES5 or ES6 class for returning value in render function (require-render-return) +# Enforce ES5 or ES6 class for returning value in render function (react/require-render-return) When writing the `render` method in a component it is easy to forget to return the JSX content. This rule will warn if the `return` statement is missing. diff --git a/docs/rules/self-closing-comp.md b/docs/rules/self-closing-comp.md index 2913c5ef3c..a81d54f274 100644 --- a/docs/rules/self-closing-comp.md +++ b/docs/rules/self-closing-comp.md @@ -1,4 +1,4 @@ -# Prevent extra closing tags for components without children (self-closing-comp) +# Prevent extra closing tags for components without children (react/self-closing-comp) Components without children can be self-closed to avoid unnecessary extra closing tag. diff --git a/docs/rules/sort-comp.md b/docs/rules/sort-comp.md index 88da135b23..33c94a1b14 100644 --- a/docs/rules/sort-comp.md +++ b/docs/rules/sort-comp.md @@ -1,4 +1,4 @@ -# Enforce component methods order (sort-comp) +# Enforce component methods order (react/sort-comp) When creating React components it is more convenient to always follow the same organisation for methods order to helps you to easily find lifecyle methods, event handlers, etc. @@ -39,7 +39,7 @@ var Hello = createReactClass({ This rule can take one argument to customize the components organisation. -``` +```js ... "react/sort-comp": [, { order: , groups: }] ... diff --git a/docs/rules/sort-prop-types.md b/docs/rules/sort-prop-types.md index 44d6f7d0a5..d59ebc2c11 100644 --- a/docs/rules/sort-prop-types.md +++ b/docs/rules/sort-prop-types.md @@ -1,4 +1,4 @@ -# Enforce propTypes declarations alphabetical sorting (sort-prop-types) +# Enforce propTypes declarations alphabetical sorting (react/sort-prop-types) Some developers prefer to sort propTypes declarations alphabetically to be able to find necessary declaration easier at the later time. Others feel that it adds complexity and becomes burden to maintain. diff --git a/docs/rules/style-prop-object.md b/docs/rules/style-prop-object.md index 648c30567d..389afa4e46 100644 --- a/docs/rules/style-prop-object.md +++ b/docs/rules/style-prop-object.md @@ -1,4 +1,4 @@ -# Enforce style prop value being an object (style-prop-object) +# Enforce style prop value being an object (react/style-prop-object) Require that the value of the prop `style` be an object or a variable that is an object.