disable max-lines-per-function on certain function **names**

Question

I'm using ESLint's max-lines-per-function to make sure I refactor in time. My React components' render function almost always exceed my 25 lines and I was wondering, besides adding a disable comment, if there was a way to disable an ESLint rule for certain function names (such as render)?

Answer 1

You can use an ESLint plugin eslint-plugin-react-func. It also has a rule called max-lines-per-function, but this rule will skip any function that contains JSX element

 npm i eslint-plugin-react-func -D

or

 yarn add eslint-plugin-react-func -D

In your .eslintrc.* file

{
  "rules": {
    "react-func/max-lines-per-function": [
      "warn",
        {
          "max": 25,
          "skipBlankLines": true,
          "skipComments": true,
          "IIFEs": true
        }
     ],
  },
    "plugins": ["react-func"]
}