T

typescript

by @lobehubv
4.9(17)

TypeScriptのコードスタイルガイドラインを提供し、型が推論可能な場合は明示的な型アノテーションを避けることを強調します。

TypeScriptJavaScriptStatic TypingNode.jsType SafetyGitHub
インストール方法
npx skills add lobehub/lobehub --skill typescript
compare_arrows

Before / After 効果比較

1
使用前

TypeScriptプロジェクトで型を無作為に使用すると、大量の暗黙的なanyが発生し、型安全性が形骸化し、コードの理解と保守が困難になります。

使用後

TypeScriptのコードスタイルガイドラインに従い、型推論を優先し、暗黙的なanyを避け、正確な型を使用し、オブジェクトの形状定義にはinterfaceを優先することで、コードの品質と保守性が向上します。

description SKILL.md

typescript

TypeScript Code Style Guide

Types and Type Safety

  • Avoid explicit type annotations when TypeScript can infer

  • Avoid implicitly any; explicitly type when necessary

  • Use accurate types: prefer Record<PropertyKey, unknown> over object or any

  • Prefer interface for object shapes (e.g., React props); use type for unions/intersections

  • Prefer as const satisfies XyzInterface over plain as const

  • Prefer @ts-expect-error over @ts-ignore over as any

  • Avoid meaningless null/undefined parameters; design strict function contracts

  • Prefer ES module augmentation (declare module '...') over namespace; do not introduce namespace-based extension patterns

  • When a type needs extensibility, expose a small mergeable interface at the source type and let each feature/plugin augment it locally instead of centralizing all extension fields in one registry file

  • For package-local extensibility patterns like PipelineContext.metadata, define the metadata fields next to the processor/provider/plugin that reads or writes them

Async Patterns

  • Prefer async/await over callbacks or .then() chains

  • Prefer async APIs over sync ones (avoid *Sync)

  • Use promise-based variants: import { readFile } from 'fs/promises'

  • Use Promise.all, Promise.race for concurrent operations where safe

Imports

  • This project uses simple-import-sort/imports and consistent-type-imports (fixStyle: 'separate-type-imports')

  • Separate type imports: always use import type { ... } for type-only imports, NOT import { type ... } inline syntax

  • When a file already has import type { ... } from a package and you need to add a value import, keep them as two separate statements:

import type { ChatTopicBotContext } from '@lobechat/types';
import { RequestTrigger } from '@lobechat/types';

  • Within each import statement, specifiers are sorted alphabetically by name

Code Structure

  • Prefer object destructuring

  • Use consistent, descriptive naming; avoid obscure abbreviations

  • Replace magic numbers/strings with well-named constants

  • Defer formatting to tooling

UI and Theming

  • Use @lobehub/ui, Ant Design components instead of raw HTML tags

  • Design for dark mode and mobile responsiveness

  • Use antd-style token system instead of hard-coded colors

Performance

  • Prefer for…of loops over index-based for loops

  • Reuse existing utils in packages/utils or installed npm packages

  • Query only required columns from database

Time Consistency

  • Assign Date.now() to a constant once and reuse for consistency

Logging

  • Never log user private information (API keys, etc.)

  • Don't use import { log } from 'debug' directly (logs to console)

  • Use console.error in catch blocks instead of debug package

  • Always log the error in .catch() callbacks — silent .catch(() => fallback) swallows failures and makes debugging impossible

Weekly Installs768Repositorylobehub/lobehubGitHub Stars73.9KFirst SeenJan 27, 2026Security AuditsGen Agent Trust HubPassSocketPassSnykPassInstalled onopencode644codex639gemini-cli628github-copilot605kimi-cli537amp533

forumユーザーレビュー (0)

レビューを書く

効果
使いやすさ
ドキュメント
互換性

レビューなし

統計データ

インストール数930
評価4.9 / 5.0
バージョン
更新日2026年3月17日
比較事例1 件

ユーザー評価

4.9(17)
5
0%
4
0%
3
0%
2
0%
1
0%

この Skill を評価

0.0

対応プラットフォーム

🔧Claude Code
🔧OpenClaw
🔧OpenCode
🔧Codex
🔧Gemini CLI
🔧GitHub Copilot
🔧Amp
🔧Kimi CLI

タイムライン

作成2026年3月17日
最終更新2026年3月17日