Skip to content
This repository was archived by the owner on Dec 10, 2025. It is now read-only.

Commit 6f09cc6

Browse files
committed
docs: update documentation for Biome and Lefthook integration, emphasizing co-location and standard practices
1 parent 20152bc commit 6f09cc6

File tree

5 files changed

+207
-376
lines changed

5 files changed

+207
-376
lines changed

README.md

Lines changed: 57 additions & 39 deletions
Original file line numberDiff line numberDiff line change
@@ -12,23 +12,23 @@
1212

1313
- **Monorepo for all SylphLab TypeScript configurations and guidelines**
1414
- **Includes:**
15-
- [@sylphlab/biome-config](./packages/biome-config): Base Biome configuration (formatting & linting).
16-
- [@sylphlab/biome-config-react](./packages/biome-config-react): Extends base Biome config for React projects.
17-
- [@sylphlab/biome-config-vue](./packages/biome-config-vue): Extends base Biome config for Vue projects.
18-
- [@sylphlab/typescript-config](./packages/typescript-config): Strict, reusable tsconfig bases.
19-
- *Deprecated:* `@sylphlab/eslint-config-*` and `@sylphlab/prettier-config` packages are being replaced by Biome.
15+
- [@sylphlab/biome-config](./packages/biome-config): Base Biome configuration (formatting & linting). Includes Standard and Strict tiers.
16+
- [@sylphlab/typescript-config](./packages/typescript-config): Strict, reusable tsconfig bases (Node, DOM, React, Vue, React Native).
17+
- *Deprecated:* `@sylphlab/eslint-config-*` and `@sylphlab/prettier-config` packages are replaced by Biome.
2018
- **Managed with:** Turborepo, pnpm workspaces
19+
- **Build Tool:** tsup (for building packages)
2120
- **Documentation:** [@sylphlab/typescript-docs](./packages/docs/) (Built with Astro Starlight)
2221

2322
---
2423

2524
## Core Philosophy
2625

27-
- **Extreme strictness:** All critical lint rules are errors. No compromise on quality.
28-
- **Modern tooling:** Biome (Linting/Formatting), TypeScript 5+, pnpm, Turborepo, ESM-first.
29-
- **AI & developer ergonomics:** Explicit typing, clear naming, strict structure, consistent formatting via Biome.
30-
- **Automation:** Biome via Lefthook (pre-commit hook), CI/CD (GitHub Actions), Dependabot.
31-
- **Performance & bug prevention:** Fast tooling (Biome), static analysis, security rules, complexity limits.
26+
- **Extreme strictness:** All critical lint rules are errors. No compromise on quality (especially with `@sylphlab/biome-config/strict`).
27+
- **Modern tooling:** Biome (Linting/Formatting), tsup (Building), TypeScript 5+, pnpm, Turborepo, Lefthook (Git Hooks), ESM-first.
28+
- **AI & developer ergonomics:** Explicit typing, clear naming, strict structure (co-location), consistent formatting via Biome.
29+
- **Automation:** Biome & commitlint via Lefthook (pre-commit/commit-msg hooks), CI/CD (GitHub Actions), Dependabot.
30+
- **Performance & bug prevention:** Fast tooling (Biome, tsup), static analysis, security rules, complexity limits.
31+
- **Mandatory Co-location:** Test (`*.test.ts`) and benchmark (`*.bench.ts`) files **MUST** reside in the same directory as the source file they target.
3232

3333
---
3434

@@ -45,12 +45,18 @@ pnpm install
4545
- Each package has its own README with install and usage.
4646
- See [packages/](./packages/).
4747

48-
### Run
48+
### Run Standard Scripts
49+
50+
These scripts should be defined in the root `package.json` and individual package `package.json` files as needed, aligning with Core Instruction V.I.
4951

5052
```bash
51-
pnpm run build # Build packages if needed (e.g., docs site)
52-
pnpm run check # Run Biome checks (lint + format check) across all packages
53-
pnpm run format # Apply Biome formatting fixes across all packages
53+
pnpm run format # Apply Biome formatting fixes
54+
pnpm run check # Run Biome checks (lint + format check) & apply safe fixes
55+
pnpm run lint # Alias for 'check'
56+
pnpm run typecheck # Run TypeScript compiler checks (tsc --noEmit)
57+
pnpm run test # Run tests (e.g., Vitest)
58+
pnpm run validate # Run check, typecheck, and test sequentially
59+
pnpm run build # Build packages using tsup (via Turborepo if applicable)
5460
```
5561

5662
---
@@ -60,69 +66,81 @@ pnpm run format # Apply Biome formatting fixes across all packages
6066
```bash
6167
# Install Biome and the base config
6268
pnpm add -D @biomejs/biome @sylphlab/biome-config
63-
# Or for React projects:
64-
# pnpm add -D @biomejs/biome @sylphlab/biome-config-react
6569
```
6670

6771
Create `biome.json` in your package root:
6872

6973
```json
7074
{
71-
// Use relative path to the installed shared config
72-
"extends": ["./node_modules/@sylphlab/biome-config/biome.json"]
73-
// Or for React:
74-
// "extends": ["./node_modules/@sylphlab/biome-config-react/biome.json"]
75+
// Extend the shared config (Standard tier)
76+
"extends": ["@sylphlab/biome-config"]
77+
// Or for Strict tier:
78+
// "extends": ["@sylphlab/biome-config/strict"]
79+
80+
// Add project-specific overrides below if absolutely necessary
81+
// "files": { "ignore": ["dist/**"] },
82+
// "linter": { ... },
83+
// "formatter": { ... }
7584
}
7685
```
77-
*(Note: The relative path `../biome-config/biome.json` works within the monorepo itself, but consuming projects outside the monorepo need the `./node_modules/...` path).*
7886

79-
Add scripts to your `package.json`:
80-
```json
81-
{
82-
"scripts": {
83-
"format": "biome format --write .",
84-
"check": "biome check --write --unsafe ."
85-
}
86-
}
87-
```
87+
Add standard scripts to your `package.json` (see "Run Standard Scripts" above).
8888

8989
---
9090

9191
## Quick Start: TypeScript Config
9292

9393
```bash
94-
pnpm add -d typescript @sylphlab/typescript-config
94+
pnpm add -D typescript @sylphlab/typescript-config
9595
```
9696

97-
`tsconfig.json`:
97+
`tsconfig.json` (example for a Node package):
9898

9999
```json
100100
{
101-
"extends": "@sylphlab/typescript-config/base",
101+
// Choose the appropriate base: node, dom, react, vue, react-native
102+
"extends": "@sylphlab/typescript-config/node",
102103
"compilerOptions": {
104+
// Output directory for tsup/tsc
103105
"outDir": "dist",
106+
// Source directory
104107
"rootDir": "src"
108+
// DO NOT use "composite": true or "references" in workspace packages
105109
},
106-
"include": ["src/**/*"]
110+
"include": ["src/**/*"],
111+
"exclude": ["node_modules", "dist", "**/*.test.ts", "**/*.spec.ts", "**/*.bench.ts"]
107112
}
108113
```
109114

110115
---
111116

112-
## Documentation
117+
## Build Tool (tsup)
113118

114-
- The documentation site is built using Astro Starlight and located in the `packages/docs` directory.
115-
- Run `pnpm run docs:dev` to start the local development server.
119+
- Package building (compilation, declarations) **MUST** use `tsup`.
120+
- Configure `tsup.config.ts` with `dts: true` and list workspace dependencies in `external`.
121+
- Do **NOT** use `tsc` command-line for building workspace packages.
116122

117123
---
118124

119-
## Contributing
125+
## Git Hooks (Lefthook + commitlint)
126+
127+
- Enforces standards (Biome checks, commit message format) automatically before commits.
128+
- Requires `lefthook`, `@commitlint/cli`, `@commitlint/config-conventional`.
129+
- Configure via `lefthook.yml` and `commitlint.config.cjs`.
130+
- See [Code Style & Quality Docs](./packages/docs/src/content/docs/style-guide/style-quality.md) for setup.
131+
132+
---
133+
134+
## Documentation
135+
136+
- The documentation site is built using Astro Starlight and located in the `packages/docs` directory.
137+
- Run `pnpm run docs:dev` to start the local development server.
120138

121139
---
122140

123141
## Contributing
124142

125-
- PRs welcome. Follow code style and quality standards.
143+
- PRs welcome. Follow code style (Biome), quality standards, and commit conventions (Conventional Commits via commitlint).
126144

127145
## License
128146

packages/docs/src/content/docs/best-practices/structure-patterns.md

Lines changed: 43 additions & 51 deletions
Original file line numberDiff line numberDiff line change
@@ -3,84 +3,76 @@ title: Project Structure & Patterns
33
sidebar: {}
44
---
55

6-
# TypeScript Project Structure & Best Practices
6+
# TypeScript Project Structure & Patterns
77

8-
This section details the recommended project structure for TypeScript NPM packages and outlines key best practices for writing robust, maintainable, and performant code.
8+
This section details the recommended project structure for TypeScript NPM packages and outlines key best practices for writing robust, maintainable, and performant code, emphasizing the **mandatory co-location** of tests and benchmarks.
99

10-
## 1. Standard NPM Package Structure
10+
## 1. Standard NPM Package Structure (Co-location MANDATORY)
1111

1212
- **Recommended Directory Structure**:
1313
```
1414
/
15-
├── src/ # TypeScript source code
16-
│ ├── index.ts # Main entry point (exports public API)
17-
│ ├── types/ # Shared type definitions (e.g., types.ts or interfaces.ts)
18-
│ ├── utils/ # Utility functions
19-
│ └── core/ # Core logic modules
20-
│ └── constants.ts # Constants
21-
├── tests/ # Test files (using Vitest)
22-
│ ├── setup.ts # Global test setup
23-
│ └── *.test.ts # Unit/Integration tests
24-
├── docs/ # Documentation source (for VitePress)
25-
│ ├── api/ # Generated API docs (markdown)
26-
│ ├── guide/ # Manual guides
27-
│ └── .vitepress/ # VitePress config
28-
├── examples/ # Usage examples (e.g., simple scripts)
29-
├── benchmark/ # Performance benchmarks (*.bench.ts)
30-
├── scripts/ # Build/utility scripts (e.g., generate-api-docs.mjs)
31-
├── dist/ # Compiled JavaScript output (git-ignored)
32-
├── .github/ # GitHub Actions workflows, issue templates, etc.
15+
├── src/ # TypeScript source code
16+
│ ├── index.ts # Main entry point (exports public API)
17+
│ ├── moduleA.ts # Example source file
18+
│ ├── moduleA.test.ts # Test for moduleA (co-located)
19+
│ ├── moduleA.bench.ts # Benchmark for moduleA (co-located)
20+
│ ├── components/ # Example subdirectory
21+
│ │ ├── Button.tsx # Example component
22+
│ │ └── Button.test.tsx # Test for Button (co-located)
23+
│ ├── types/ # Shared type definitions (e.g., types.ts)
24+
│ └── utils/ # Utility functions
25+
│ ├── helpers.ts # Example utility
26+
│ └── helpers.spec.ts # Test for helpers (co-located, .spec also valid)
27+
├── dist/ # Compiled JavaScript output (git-ignored)
28+
├── .github/ # GitHub Actions workflows, issue templates, etc.
3329
│ └── workflows/
34-
├── .husky/ # Husky Git hooks config
35-
├── .vscode/ # VSCode settings (optional)
36-
├── tsconfig.json # TypeScript configuration
37-
├── eslint.config.ts # ESLint flat configuration (using TS)
38-
# Note: .eslintignore is not used with flat config; use 'ignores' in eslint.config.ts
39-
├── prettier.config.cjs # Prettier configuration (using CJS)
40-
├── .prettierignore # Files to ignore for Prettier
41-
├── vitest.config.ts # Vitest configuration
42-
├── commitlint.config.cjs # Commitlint configuration
43-
├── package.json # NPM package manifest
44-
├── LICENSE # License file (e.g., MIT)
45-
└── README.md # Project description
30+
├── .vscode/ # VSCode settings (optional)
31+
├── biome.json # Biome configuration (replaces ESLint/Prettier)
32+
├── tsconfig.json # TypeScript configuration
33+
├── vitest.config.ts # Vitest configuration (for tests/benchmarks)
34+
├── lefthook.yml # Lefthook Git hooks config (replaces Husky)
35+
├── commitlint.config.cjs # Commitlint configuration
36+
├── package.json # NPM package manifest
37+
├── LICENSE # License file (e.g., MIT)
38+
└── README.md # Project description
4639
```
40+
- **Co-location Rule (Mandatory):** Test files (`*.test.ts(x)`, `*.spec.ts(x)`) and benchmark files (`*.bench.ts(x)`) **MUST** be located in the **SAME DIRECTORY** as the source file they target. Do **NOT** use separate top-level `test/`, `spec/`, or `bench/` directories. This is enforced by project convention (V.I).
4741
- **Package Name (`name` in `package.json`)**: Use `kebab-case` (e.g., 'my-awesome-library'). For scoped packages, use `@scope/kebab-case-name`.
4842

4943
## 2. Advanced TypeScript Patterns (Encouraged)
5044

5145
- **Immutability**:
52-
- Use `readonly` modifiers for properties and `Readonly<T>` / `ReadonlyArray<T>` (`@typescript-eslint/prefer-readonly`).
46+
- Use `readonly` modifiers for properties and `Readonly<T>` / `ReadonlyArray<T>`.
5347
- Leverage TypeScript's `const` assertions (`as const`) for literal types when creating immutable constants.
5448
- **Type Safety**:
55-
- Use branded types or nominal typing techniques for primitive type safety where applicable (e.g., distinguishing between different kinds of string IDs).
56-
- Prefer discriminated unions for modeling state or variants over loose objects or class hierarchies.
49+
- Use branded types or nominal typing techniques for primitive type safety where applicable.
50+
- Prefer discriminated unions for modeling state or variants.
5751
- **Object Creation**:
58-
- Implement the Builder pattern for complex object creation to ensure valid states.
52+
- Implement the Builder pattern for complex object creation.
5953
- Use factory functions or static methods instead of complex constructors.
6054
- **Operations on Types**:
6155
- Apply the Visitor pattern for type-safe operations on discriminated unions.
62-
- Leverage Mapped Types (`Pick`, `Omit`, `Partial`, `Required`, custom) for consistent type transformations.
56+
- Leverage Mapped Types (`Pick`, `Omit`, `Partial`, `Required`, custom).
6357
- Use the `satisfies` operator for ensuring type compatibility without changing the inferred type.
6458

6559
## 3. Best Practices
6660

6761
- **Error Handling**:
68-
69-
- Primarily use discriminated union result types (e.g., `{ success: true, data: T } | { success: false, error: E }`, potentially using helper libraries) for handling predictable errors, making failure an explicit part of the function's contract.
70-
- Reserve throwing exceptions for truly exceptional, unrecoverable situations (e.g., programming errors, critical infrastructure failures). When throwing, use custom error classes extending `Error`.
71-
- Always include context and potentially the original error (`cause`) when creating errors or error results.
72-
- Validate API boundaries and external data rigorously using runtime validation libraries (like Zod, io-ts) that integrate with TypeScript types to ensure data integrity.
62+
- Primarily use discriminated union result types (e.g., `{ success: true, data: T } | { success: false, error: E }`) for predictable errors.
63+
- Reserve throwing exceptions for truly exceptional, unrecoverable situations. Use custom error classes extending `Error`.
64+
- Always include context and potentially the original error (`cause`).
65+
- Validate API boundaries and external data rigorously using runtime validation libraries (like Zod) that integrate with TypeScript types.
7366

7467
- **Asynchronous Code**:
75-
76-
- Always prefer `async/await` for readability over raw `Promise.then/catch` chains.
77-
- Ensure all Promises are handled (use `@typescript-eslint/no-floating-promises` lint rule).
68+
- Always prefer `async/await` for readability.
69+
- Ensure all Promises are handled (use Biome lint rules).
7870
- Use `Promise.all` / `Promise.allSettled` for concurrency.
79-
- Avoid the `new Promise()` constructor anti-pattern; use `async` functions instead.
80-
- Implement cancellation patterns (e.g., using `AbortController`) for long-running async operations where appropriate.
71+
- Avoid the `new Promise()` constructor anti-pattern; use `async` functions.
72+
- Implement cancellation patterns (e.g., using `AbortController`) where appropriate.
8173

8274
- **Performance Optimizations**:
8375
- Be mindful of object and array allocations within loops or frequently called functions.
84-
- Use `Set` and `Map` for efficient lookups (O(1) average) compared to array methods like `find` or `includes` (O(n)).
85-
- Employ lazy initialization for expensive resources or computations.
86-
- Profile code using Node.js inspector or other tools to identify bottlenecks before optimizing prematurely.
76+
- Use `Set` and `Map` for efficient lookups.
77+
- Employ lazy initialization for expensive resources.
78+
- Profile code using Node.js inspector or other tools before optimizing prematurely.

0 commit comments

Comments
 (0)