mcpField
T
typescript-magician

typescript-magician

github.com/mcollina开发2.0k2.8k 次安装1 周前更新
代码仓库

关于 typescript-magician

面向处理类型错误和复杂类型问题的 TypeScript 技能,强调精确、安全的类型修复,并通过 tsc 验证。

主要功能

  1. 01高级泛型与类型推断
  2. 02条件类型与映射类型
  3. 03类型收窄与工具类型
  4. 04品牌类型与模块扩展
  5. 05修改前后执行编译检查
  6. 06类型测试与 IntelliSense 指导

适用场景

  1. 01诊断 TypeScript 编译器错误
  2. 02用精确类型替换 any
  3. 03解决复杂泛型推断问题
  4. 04为代码库添加严格类型

安装

复制下面的命令,在终端中运行。

$npx skills add https://github.com/mcollina/skills --skill typescript-magician

安装后在 Claude Code 中输入/typescript-magician确认已加载。

包含的文件

除 SKILL.md 外,安装时一起下载的参考资料和脚本。

tile.json
rules/
array-index-access.md
as-const-typeof.md
builder-pattern.md
conditional-types.md
deep-inference.md
error-diagnosis.md
function-overloads.md
generics-basics.md
infer-keyword.md
mapped-types.md
opaque-types.md
template-literal-types.md
type-narrowing.md
utility-types.md

详细介绍

适用场景

适用于:

  • TypeScript 错误和类型难题
  • 从代码库中消除 any 类型
  • 复杂的泛型和类型推断问题
  • 需要严格类型检查时

说明

调用时:

  1. 先运行 tsc --noEmit,在进行更改前收集完整的错误输出
  2. 找出类型问题的根本原因(推断不健全、缺少约束、隐式 any 等)
  3. 使用 TypeScript 高级特性,制定精确且类型安全的解决方案
  4. 使用适当的类型消除所有 any 类型,并验证每项替换仍满足调用点的要求
  5. 再次运行 tsc --noEmit,确认修复后可顺利编译

能力包括:

  • 高级泛型和条件类型
  • 模板字面量类型和映射类型
  • 工具类型和类型操作
  • 品牌类型和名义类型
  • 复杂的推断模式
  • 协变规则和分布规则
  • 模块扩充和声明合并

针对每个 TypeScript 难题:

  • 解释问题背后的类型理论
  • 在适用时提供多种解决方案
  • 展示修改前后的类型表示
  • 包含全面的类型测试
  • 确保 IntelliSense 支持完整

快速示例

使用泛型消除 any

修改前

function getProperty(obj: any, key: string): any {
  return obj[key];
}

修改后

function getProperty<T, K extends keyof T>(obj: T, key: K): T[K] {
  return obj[key];
}
// getProperty({ name: "Alice" }, "name") → inferred as string ✓
收窄未知的 API 响应类型

修改前

async function fetchUser(): Promise<any> {
  const res = await fetch("/api/user");
  return res.json();
}

修改后

interface User { id: number; name: string }

function isUser(value: unknown): value is User {
  return (
    typeof value === "object" &&
    value !== null &&
    "id" in value &&
    "name" in value
  );
}

async function fetchUser(): Promise<User> {
  const res = await fetch("/api/user");
  const data: unknown = await res.json();
  if (!isUser(data)) throw new Error("Invalid user shape");
  return data;
}

参考资料

阅读各规则文件,了解详细说明和代码示例:

核心模式
高级泛型
类型级编程
类型安全模式
调试

评论

支持 Markdown