Linters

In app projects, linting and formatting are reliability tools, not style accessories.

Goal

You want to achieve three outcomes:

1. Catch errors early.
2. Keep team conventions consistent.
3. Reserve reviews for architecture and behavior.

1. Install tools

npm install --save-dev eslint prettier eslint-config-prettier

2. Configure ESLint

Create eslint.config.js:

const js = require('@eslint/js')

module.exports = [
  js.configs.recommended,
  {
    languageOptions: {
      ecmaVersion: 'latest',
      sourceType: 'commonjs',
    },
    rules: {
      'no-unused-vars': 'warn',
      'no-console': 'off',
      eqeqeq: ['error', 'always'],
    },
  },
]

Why eqeqeq matters: implicit coercion often causes event flow bugs.

3. Add Prettier

Create .prettierrc.json:

{
  "singleQuote": true,
  "semi": false,
  "trailingComma": "all",
  "printWidth": 100
}

4. Add scripts in package.json

{
  "scripts": {
    "lint": "eslint src",
    "lint:fix": "eslint src --fix",
    "format": "prettier --write src",
    "format:check": "prettier --check src"
  }
}

5. Daily workflow

Use this sequence consistently:

1. run npm run lint before commit.
2. run npm run format for file consistency.
3. run npm run lint again before push.

This lowers integration noise across branches.

6. Rule focus for app projects

Extend rules intentionally:

1. warnings for unused values,
2. strict equality checks,
3. no silent promise failures,
4. no uncontrolled global state.

Add plugins gradually as your codebase grows.

7. Editor integration

For VS Code, these settings are useful:

{
  "editor.formatOnSave": true,
  "editor.defaultFormatter": "esbenp.prettier-vscode",
  "editor.codeActionsOnSave": {
    "source.fixAll.eslint": "explicit"
  }
}

8. Add a pre commit guard

Optional but recommended:

npm install --save-dev husky
npx husky init

Then configure .husky/pre-commit:

npm run lint
npm run format:check

This prevents broken quality checks from entering the repository.