FG
🛠️ Developer Tools

Proposed Rule: Enforce lines between class methods

Freshabout 22 hours ago
Mar 14, 20260 views
Confidence Score89%
89%

Problem

I would like to propose a rule that enforces empty lines between class functions. When enabled and set to "always" it should make sure that there is at least one empty line between every method in a class declaration. If set to "never" the opposite would be true, that is, there should not be any empty lines at all between class methods. A line with a comment on should not count as an empty line. This rule should not concern itself with the class padding (empty lines before the first method and after the last method) since that is already taken care of by `padded-blocks`. It also shouldn't concern itself with how many empty lines that are present, since that is a job for `no-multiple-empty-lines`. This is a stylistic rule. The following patterns would be considered problems: [code block] The following pattern would be considered valid: [code block]

Unverified for your environment

Select your OS to check compatibility.

1 Fix

Canonical Fix
Unverified Fix
New Fix – Awaiting Verification

Implement ESLint Rule for Method Spacing in Classes

Medium Risk

The absence of a rule enforcing empty lines between class methods leads to inconsistent formatting in JavaScript classes. This can make the code harder to read and maintain, as developers may have different preferences for spacing between methods.

Awaiting Verification

Be the first to verify this fix

  1. 1

    Create ESLint Rule for Method Spacing

    Develop a custom ESLint rule that checks for the presence of empty lines between class methods based on the specified configuration ('always' or 'never'). This rule will ignore comments and will not interfere with existing rules like 'padded-blocks' or 'no-multiple-empty-lines'.

    javascript
    module.exports = {
      meta: {
        type: 'layout',
        docs: {
          description: 'enforce empty lines between class methods',
          category: 'Stylistic Issues',
        },
        schema: [
          {
            'enum': ['always', 'never'],
          },
        ],
      },
      create: function(context) {
        const option = context.options[0] || 'always';
        return {
          'MethodDefinition': function(node) {
            // Logic to check for empty lines between methods
          }
        };
      },
    };
  2. 2

    Add Rule to ESLint Configuration

    Once the custom rule is created, add it to your ESLint configuration file (.eslintrc.js or .eslintrc.json) under the rules section. Set the desired option to 'always' or 'never' based on your team's coding standards.

    json
    {
      "rules": {
        "method-spacing": ["error", "always"]
      }
    }
  3. 3

    Test the Custom Rule

    Run ESLint on your codebase to ensure that the new rule is functioning correctly. Check for any violations of the rule based on the configured option. Adjust the rule logic if necessary to handle edge cases.

    bash
    eslint .
  4. 4

    Document the New Rule

    Update your project's documentation to include information about the new method spacing rule. Explain the reasoning behind its implementation and provide examples of both valid and invalid code according to the rule.

    markdown
    ## Method Spacing Rule
    
    This rule enforces empty lines between class methods. 
    
    ### Examples:
    - Invalid:
    ```javascript
    class Example {
      method1() {}
      method2() {}
    }
    ```
    - Valid:
    ```javascript
    class Example {
      method1() {}
    
      method2() {}
    }
    ```

Validation

To confirm the fix worked, run ESLint on your codebase and check for any reported violations related to method spacing. Ensure that the output reflects the desired configuration (either enforcing or disallowing empty lines between methods).

Sign in to verify this fix

Environment

Submitted by

AC

Alex Chen

2450 rep

Tags

eslintlintingjavascriptruleacceptedfeaturehelp-wanted