Using ESLint’s --fix-type to Apply Only Formatting Fixes

Problem: Automatic fixes risk changing logic

Teams often run eslint --fix in a pre‑commit hook or CI step to keep code style consistent. However, the default behavior attempts to fix every rule that declares a fix, including logic‑oriented rules such as eqeqeq or no‑unused‑vars. When those fixes run, they can unintentionally alter program behavior, leading to confusing code reviews or regressions.

Thesis: Limit autofix to formatting‑only rules with --fix-type layout

Starting with ESLint v8.22.0, the --fix-type flag lets you scope the autofix pass to a specific category of rules. By selecting the layout category, only whitespace, indentation, quotes, trailing commas, and similar style rules are applied, while all other fixable rules remain untouched.

How the flag works

Each ESLint rule can declare one or more fix types in its metadata (layout, problem, suggestion). When you invoke:

eslint src/**/*.js --fix --fix-type layout

ESLint builds a set of rules whose declared fix type includes layout. Only those rules are allowed to emit fixes; all other fixable rules are ignored for this run. The flag does not change the rule evaluation itself—violations are still reported—but it prevents the automatic correction step for non‑layout rules.

Worked example

1. Create a temporary workspace and initialize a Node project:

mkdir eslint-fix-type-demo && cd eslint-fix-type-demo
npm init -y
npm install eslint@latest   # ensures v8.22.0 or newer

2. Add a simple ESLint configuration that enables both a layout rule and a logic rule:

cat > .eslintrc.js <<'EOF'
module.exports = {
  env: { browser: true, es2021: true },
  extends: 'eslint:recommended',
  rules: {
    'indent': ['error', 2],          // layout rule
    'quotes': ['error', 'single'],   // layout rule
    'eqeqeq': ['error']              // logic‑changing rule
  }
};
EOF

3. Create a JavaScript file with intentional layout issues and a logic issue:

cat > src/example.js <<'EOF'
function add(a,b){
  if (a == b) {
    return a+b;
  }
}
EOF

4. Run the limited autofix command:

npx eslint src/**/*.js --fix --fix-type layout

After the command finishes, inspect src/example.js. You will see that the indentation and spacing have been corrected (tabs/spaces normalized, quotes unchanged because we used double quotes, but the rule would fix them if needed), while the == comparison remains exactly as written.

5. For comparison, run the command without the flag:

npx eslint src/**/*.js --fix

This time ESLint also attempts to fix the equality operator, changing == to === (assuming eqeqeq is enabled). The logic of the function is altered, demonstrating why scoping the fix type matters.

Trade‑offs and limitations

• Version requirement: --fix-type is only available in ESLint ≥8.22.0. Older versions silently ignore the flag and apply all fixable rules, so you must pin a compatible version in your project’s package.json.
• Rule categorization: A rule may declare multiple fix types (rare). ESLint selects the first matching category when building the fix set, which could cause unexpected fixes if you rely on a very narrow interpretation of layout. Review the metadata of any custom or third‑party rules you use.
• No effect on reporting: The flag only influences the fix step. All rule violations continue to appear in the lint output, so you still see logic‑related errors in your editor or CI logs.

Actionable closing: Add the command to your workflow

To enforce formatting without risking logic changes, incorporate the limited autofix into your pre‑commit hook or CI pipeline:

# Example for husky pre‑commit
npx husky add .husky/pre-commit "npx eslint '**/*.{js,ts}' --fix --fix-type layout"

In CI (e.g., GitHub Actions), you can add a step that runs the same command and fails the build if any lint errors remain after formatting:

- name: Lint and format
  run: npx eslint '**/*.{js,ts}' --fix --fix-type layout
- name: Verify no lint errors
  run: npx eslint '**/*.{js,ts}'

By limiting autofix to the layout category, you gain the productivity benefits of automatic formatting while preserving the intent of your code’s logic.