工具链：ESLint / Prettier / nodemon

三件套

ESLint

npm install -D eslint @eslint/js
npx eslint --init        # 交互式初始化

eslint.config.js（Flat config，ESLint 9+）:

import js from '@eslint/js';

export default [
    js.configs.recommended,
    {
        rules: {
            'no-unused-vars': 'warn',
            'no-console': 'off',
            'prefer-const': 'error',
        },
    },
];

TypeScript 支持

npm install -D typescript-eslint

import js from '@eslint/js';
import tseslint from 'typescript-eslint';

export default [
    js.configs.recommended,
    ...tseslint.configs.recommended,
    {
        rules: {
            '@typescript-eslint/no-unused-vars': 'warn',
        },
    },
];

跑

npx eslint .                      # 全项目
npx eslint src/                   # 指定目录
npx eslint --fix .                # 自动修能修的

Prettier

npm install -D prettier
echo '{}' > .prettierrc.json

.prettierrc.json:

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

npx prettier --check .            # 看哪些没格式化
npx prettier --write .            # 全部格式化

ESLint + Prettier 共存

ESLint 关掉与 Prettier 冲突的格式规则：

npm install -D eslint-config-prettier

import prettier from 'eslint-config-prettier';

export default [
    js.configs.recommended,
    prettier,    // 永远最后
];

现代替代：Biome

npm install -D @biomejs/biome
npx biome init

Biome 把 ESLint + Prettier 合二为一——Rust 写的，比两者快得多。新项目可以试。

npx biome check .
npx biome check --write .         # 自动修

nodemon（自动重启）

npm install -D nodemon

package.json:

{
  "scripts": {
    "dev": "nodemon src/index.js"
  }
}

文件变化自动重启服务。

配置

nodemon.json:

{
  "watch": ["src", "config"],
  "ext": "js,ts,json",
  "ignore": ["src/**/*.test.js"],
  "exec": "node src/index.js"
}

tsx watch（TS 项目首选）

npx tsx watch src/index.ts

比 nodemon + ts-node 快——TS 项目用这个。

husky + lint-staged（pre-commit 检查）

提交前自动跑 lint / format：

npm install -D husky lint-staged
npx husky init

.husky/pre-commit:

npx lint-staged

package.json:

{
  "lint-staged": {
    "*.{js,ts}": ["eslint --fix", "prettier --write"],
    "*.{json,md}": ["prettier --write"]
  }
}

每次 git commit 自动只对改动的文件跑——比 CI 快。

CI 上跑

.github/workflows/ci.yml（举例）:

name: CI
on: [push, pull_request]

jobs:
  test:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v4
      - uses: actions/setup-node@v4
        with: { node-version: 22, cache: npm }
      - run: npm ci
      - run: npm run lint
      - run: npm run typecheck
      - run: npm test

VS Code 集成

.vscode/settings.json（项目内）:

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

效果：

• 保存自动格式化
• 保存自动跑 ESLint 修

一份推荐起步组合

npm install -D \
    typescript \
    tsx \
    eslint @eslint/js typescript-eslint eslint-config-prettier \
    prettier \
    vitest \
    husky lint-staged

{
  "scripts": {
    "dev": "tsx watch src/index.ts",
    "build": "tsc",
    "start": "node dist/index.js",
    "lint": "eslint .",
    "format": "prettier --write .",
    "typecheck": "tsc --noEmit",
    "test": "vitest run",
    "test:watch": "vitest"
  }
}

坑

• ESLint 9+ 改了配置文件格式（flat config）—— 老 .eslintrc 已弃
• Prettier 和 ESLint 冲突 → 装 eslint-config-prettier
• 项目协作统一 Prettier 配置 + 跟着提交—— 不然每次 PR 全文件 diff
• lint-staged 只看 staged 文件——未 add 的不会跑

下一篇：调试与性能。