antfu 编码规范与工具链配置指南：TypeScript、ESLint、pnpm 最佳实践

🇺🇸English

Coding Practices

Code Organization

• Single responsibility : Each source file should have a clear, focused scope/purpose
• Split large files : Break files when they become large or handle too many concerns
• Type separation : Always separate types and interfaces into types.ts or types/*.ts
• Constants extraction : Move constants to a dedicated constants.ts file

Runtime Environment

• Prefer isomorphic code : Write runtime-agnostic code that works in Node, browser, and workers whenever possible

• Clear runtime indicators : When code is environment-specific, add a comment at the top of the file:

  // @env node // @env browser

TypeScript

• Explicit return types : Declare return types explicitly when possible
• Avoid complex inline types : Extract complex types into dedicated type or interface declarations

Comments

• Avoid unnecessary comments : Code should be self-explanatory
• Explain "why" not "how" : Comments should describe the reasoning or intent, not what the code does

Testing (Vitest)

• Test files: foo.ts → foo.test.ts (same directory)
• Use describe/it API (not test)
• Use toMatchSnapshot for complex outputs
• Use toMatchFileSnapshot with explicit path for language-specific snapshots

Tooling Choices

@antfu/ni Commands

TypeScript Config

{
  "compilerOptions": {
    "target": "ESNext",
    "module": "ESNext",
    "moduleResolution": "bundler",
    "strict": true,
    "esModuleInterop": true,
    "skipLibCheck": true,
    "resolveJsonModule": true,
    "isolatedModules": true,
    "noEmit": true
  }
}

ESLint Setup

// eslint.config.mjs
import antfu from '@antfu/eslint-config'

export default antfu()

When completing tasks, run pnpm run lint --fix to format the code and fix coding style.

For detailed configuration options: antfu-eslint-config

Git Hooks

{
  "simple-git-hooks": {
    "pre-commit": "pnpm i --frozen-lockfile --ignore-scripts --offline && npx lint-staged"
  },
  "lint-staged": { "*": "eslint --fix" },
  "scripts": {
    "prepare": "npx simple-git-hooks"
  }
}

pnpm Catalogs

Use named catalogs in pnpm-workspace.yaml for version management:

Avoid the default catalog. Catalog names can be adjusted per project needs.

References

Weekly Installs

5.1K

Repository

antfu/skills

GitHub Stars

3.9K

First Seen

Jan 28, 2026

Security Audits

Gen Agent Trust HubPassSocketPassSnykPass

Installed on

opencode3.9K

codex3.9K

gemini-cli3.8K

github-copilot3.7K

kimi-cli3.2K

amp3.2K