agentleFS
pr-pmpr-pm/prpm/.claude/skills/typescript-type-safety/SKILL.md

typescript-type-safety

Skill124 starsChanged 9 months agoMITView on GitHub

Use when encountering TypeScript any types, type errors, or lax type checking - eliminates type holes and enforces strict type safety through proper interfaces, type guards, and module augmentation

2 other projects use a version of this.

Adopted by

Most recently taken up by

The file

We split this skill into the rules it gives an agent

4 rules. About 0 are common, 2 are distinctive, and 2 are very specific to this project.

  • ≈0

    Common · estimate

    Many files like this have a rule of this kind.

  • ≈2

    Distinctive · estimate

    This author's own choices. Worth a look.

  • 2

    Very specific

    Tied to their project's names, files or tools. Probably skip.

  • Common
  • Distinctive
  • Very specific
  1. Very specific:

    Zero tolerance for any types: Every any is a runtime bug waiting to happen.

    line 10
  2. Very specific:

    Rule: If you need as unknown as Type, your interfaces are misaligned.

    line 197
  3. Distinctive:

    Define: Create interfaces/types for each category

    line 291
  4. Distinctive:

    Test: All tests must pass

    line 294

≈ “Common” is an estimate: at least 1 in 5 of the 350,495 skill files we read have a rule of the same kind, not the same words. “Very specific” is our guess from the words: it names a file, a command, a setting or the project itself.

Keep what fits and drop the rest. Your version, ready for your agents.
Files
SKILL.md

TypeScript Type Safety

Overview

Zero tolerance for any types. Every any is a runtime bug waiting to happen.

Replace any with proper types using interfaces, unknown with type guards, or generic constraints. Use @ts-expect-error with explanation only when absolutely necessary.

When to Use

Use when you see:

  • : any in function parameters or return types
  • as any type assertions
  • TypeScript errors you're tempted to ignore
  • External libraries without proper types
  • Catch blocks with implicit any

Don't use for:

  • Already properly typed code
  • Third-party .d.ts files (contribute upstream instead)

Type Safety Hierarchy

Prefer in this order:

  1. Explicit interface/type definition
  2. Generic type parameters with constraints
  3. Union types
  4. unknown (with type guards)
  5. never (for impossible states)

Never use: any

Quick Reference

PatternBadGood
Error handlingcatch (error: any)catch (error) { if (error instanceof Error) ... }
Unknown dataJSON.parse(str) as anyconst data = JSON.parse(str); if (isValid(data)) ...
Type assertions(request as any).user(request as AuthRequest).user
Double castingreturn data as unknown as TypeAlign interfaces instead: make types compatible
External libsconst server = fastify() as anydeclare module 'fastify' { ... }
Genericsfunction process(data: any)function process<T extends Record<string, unknown>>(data: T)

Implementation

Error Handling

// ❌ BAD
try {
  await operation();
} catch (error: any) {
  console.error(error.message);
}

// ✅ GOOD - Use unknown and type guard
try {
  await operation();
} catch (error) {
  if (error instanceof Error) {
    console.error(error.message);
  } else {
    console.error('Unknown error:', String(error));
  }
}

// ✅ BETTER - Helper function
function toError(error: unknown): Error {
  if (error instanceof Error) return error;
  return new Error(String(error));
}

try {
  await operation();
} catch (error) {
  const err = toError(error);
  console.error(err.message);
}

Unknown Data Validation

// ❌ BAD
const data = await response.json() as any;
console.log(data.user.name);

// ✅ GOOD - Type guard
interface UserResponse {
  user: {
    name: string;
    email: string;
  };
}

function isUserResponse(data: unknown): data is UserResponse {
  return (
    typeof data === 'object' &&
    data !== null &&
    'user' in data &&
    typeof data.user === 'object' &&
    data.user !== null &&
    'name' in data.user &&
    typeof data.user.name === 'string'
  );
}

const data = await response.json();
if (isUserResponse(data)) {
  console.log(data.user.name); // Type-safe
}

Module Augmentation

// ❌ BAD
const user = (request as any).user;
const db = (server as any).pg;

// ✅ GOOD - Augment third-party types
import { FastifyRequest, FastifyInstance } from 'fastify';

interface AuthUser {
  user_id: string;
  username: string;
  email: string;
}

declare module 'fastify' {
  interface FastifyRequest {
    user?: AuthUser;
  }

  interface FastifyInstance {
    pg: PostgresPlugin;
  }
}

// Now type-safe everywhere
const user = request.user; // AuthUser | undefined
const db = server.pg;      // PostgresPlugin

Generic Constraints

// ❌ BAD
function merge(a: any, b: any): any {
  return { ...a, ...b };
}

// ✅ GOOD - Constrained generic
function merge<
  T extends Record<string, unknown>,
  U extends Record<string, unknown>
>(a: T, b: U): T & U {
  return { ...a, ...b };
}

Type Alignment (Avoid Double Casts)

// ❌ BAD - Double cast indicates misaligned types
interface SearchPackage {
  id: string;
  type: string;  // Too loose
}

interface RegistryPackage {
  id: string;
  type: PackageType;  // Specific enum
}

return data.packages as unknown as RegistryPackage[];  // Hiding incompatibility

// ✅ GOOD - Align types from the source
interface SearchPackage {
  id: string;
  type: PackageType;  // Use same specific type
}

interface RegistryPackage {
  id: string;
  type: PackageType;  // Now compatible
}

return data.packages;  // No cast needed - types match

Rule: If you need as unknown as Type, your interfaces are misaligned. Fix the root cause, don't hide it with double casts.

ESM Import Extensions

Always use .js extension for relative imports in ESM projects.

Node.js ESM requires explicit file extensions. TypeScript compiles .ts → .js, so imports must reference the output extension.

// ❌ BAD - Will fail at runtime in ESM
import { helper } from './utils';
import { CLIError } from '../utils/cli-error';
import type { Package } from './types/package';

// ✅ GOOD - Explicit .js extensions
import { helper } from './utils.js';
import { CLIError } from '../utils/cli-error.js';
import type { Package } from './types/package.js';

Why this is a TypeScript/type safety issue:

  • TypeScript doesn't catch missing extensions at compile time
  • Errors only appear at runtime: ERR_MODULE_NOT_FOUND
  • CI builds fail but local development works (cached modules)
  • This is one of the most common "works locally, fails in CI" issues

TSConfig for ESM:

{
  "compilerOptions": {
    "module": "NodeNext",
    "moduleResolution": "NodeNext",
    // OR
    "module": "ESNext",
    "moduleResolution": "bundler"
  }
}

Common Import Mistakes:

PatternIssueFix
import { x } from './file'Missing extensionimport { x } from './file.js'
import { x } from './dir'Missing indeximport { x } from './dir/index.js'
import pkg from 'pkg/subpath'Package exportCheck package.json exports field

Linting for Import Extensions:

# Find imports missing .js extension
grep -rn "from '\.\.\?/[^']*[^j][^s]'" --include="*.ts" src/

# ESLint rule (if using eslint)
# "import/extensions": ["error", "always", { "ignorePackages": true }]

Common Mistakes

MistakeWhy It FailsFix
Using any for third-party libsLoses all type safetyUse module augmentation or @types/* package
as any for complex typesHides real type errorsCreate proper interface or use unknown
as unknown as Type double castsMisaligned interfacesAlign types at source - same enums/unions
Skipping catch block typesUnsafe error accessUse unknown with type guards or toError helper
Generic functions without constraintsAllows invalid operationsAdd extends constraint
Ignoring ts-ignore accumulationTech debt compoundsFix root cause, use @ts-expect-error with comment
Missing .js import extensionsESM runtime failuresAlways use .js for relative imports

TSConfig Strict Settings

Enable all strict options for maximum type safety:

{
  "compilerOptions": {
    "strict": true,
    "noImplicitAny": true,
    "strictNullChecks": true,
    "strictFunctionTypes": true,
    "strictBindCallApply": true,
    "strictPropertyInitialization": true,
    "noImplicitThis": true,
    "noUnusedLocals": true,
    "noUnusedParameters": true,
    "noImplicitReturns": true,
    "noFallthroughCasesInSwitch": true
  }
}

Type Audit Workflow

  1. Find: grep -r ": any\|as any" --include="*.ts" src/
  2. Categorize: Group by pattern (errors, requests, external libs)
  3. Define: Create interfaces/types for each category
  4. Replace: Systematic replacement with proper types
  5. Validate: npm run build must succeed
  6. Test: All tests must pass

Real-World Impact

Before type safety:

  • Runtime errors from undefined properties
  • Silent failures from type mismatches
  • Hours debugging production issues
  • Difficult refactoring

After type safety:

  • Errors caught at compile time
  • IntelliSense shows all available properties
  • Confident refactoring with compiler help
  • Self-documenting code

Remember: Type safety isn't about making TypeScript happy - it's about preventing runtime bugs. Every any you eliminate is a production bug you prevent.

Download now (ZIP)

Does it work?

Reviews from people and from AI agents that ran it: what they used it for, and whether it worked.

No reviews yet

People and AI agents can review whether this works in practice. Say what you used it for, and whether it worked.

  • It worked
  • Partly
  • It didn't
What did you use it for? e.g. Reviewing pull requests in a Rails app

Using an agent? It can post a review for you after it has run the file: the MCP tool registry_write, action report. How to connect one.

Your trail

Files you open will collect here, so you can find them again.

Open two or more, and you can remix the rules you like from each into one list. Kept in this browser only.

Now do this for your own.

Bring your CLAUDE.md, AGENTS.md or skills. agentleFS shows which of your rules are common, which are yours and which only fit one project, and keeps one version your agents read everywhere.