@dbs-portal/tool-tsconfig

Shared TypeScript configurations for DBS Portal monorepo packages.

Features

• 🎯 Strict Type Checking: Comprehensive type safety with strict mode enabled
• ⚛️ React Support: Optimized configuration for React applications
• 📚 Library Configuration: Specialized settings for library packages
• 🔧 Node.js Support: Configuration for build scripts and tools
• 🏗️ Monorepo Ready: Path mapping and workspace support
• 🚀 Modern TypeScript: Latest TypeScript features and best practices

Installation

yarn add -D @dbs-portal/tool-tsconfig

Usage

Base Configuration

For general TypeScript projects:

{
  "extends": "@dbs-portal/tool-tsconfig/base.json",
  "compilerOptions": {
    "baseUrl": ".",
    "paths": {
      "@/*": ["./src/*"]
    }
  }
}

React Applications

For React applications and components:

{
  "extends": "@dbs-portal/tool-tsconfig/react.json",
  "compilerOptions": {
    "baseUrl": ".",
    "paths": {
      "@/*": ["./src/*"]
    }
  },
  "include": ["src/**/*", "vite.config.ts"]
}

Library Packages

For library packages that need to emit declarations:

{
  "extends": "@dbs-portal/tool-tsconfig/library.json",
  "compilerOptions": {
    "outDir": "dist",
    "rootDir": "src"
  }
}

Node.js Scripts

For build scripts and Node.js tools:

{
  "extends": "@dbs-portal/tool-tsconfig/node.json",
  "compilerOptions": {
    "outDir": "dist"
  }
}

Configurations

Base Configuration

• Target: ES2022 with modern JavaScript features
• Module: ESNext with bundler resolution
• Strict Mode: Full TypeScript strict checking enabled
• Path Mapping: Support for monorepo package references
• JSX: React JSX transform support

React Configuration

Extends base configuration with:

• React-specific JSX settings
• Vite client types
• React and React DOM types
• Development optimizations

Library Configuration

Extends base configuration with:

• Declaration file generation
• Source maps for debugging
• Stricter type checking
• Library-compatible module settings

Node.js Configuration

Extends base configuration with:

• Node.js types and environment
• Relaxed rules for build scripts
• CommonJS compatibility
• ts-node configuration

Compiler Options

Type Checking

All configurations include strict type checking:

{
  "strict": true,
  "noUnusedLocals": true,
  "noUnusedParameters": true,
  "exactOptionalPropertyTypes": true,
  "noImplicitReturns": true,
  "noFallthroughCasesInSwitch": true,
  "noUncheckedIndexedAccess": true
}

Module Resolution

Modern module resolution with bundler support:

{
  "module": "ESNext",
  "moduleResolution": "bundler",
  "allowImportingTsExtensions": true,
  "verbatimModuleSyntax": true
}

Path Mapping

Monorepo-aware path mapping:

{
  "baseUrl": ".",
  "paths": {
    "@/*": ["./src/*"],
    "@dbs-portal/core-*": ["../core/*/src"],
    "@dbs-portal/module-*": ["../modules/*/src"],
    "@dbs-portal/tool-*": ["../tools/*/src"]
  }
}

Package-Specific Usage

Core Packages

{
  "extends": "@dbs-portal/tool-tsconfig/library.json",
  "compilerOptions": {
    "outDir": "dist",
    "rootDir": "src",
    "declaration": true
  }
}

Module Packages

{
  "extends": "@dbs-portal/tool-tsconfig/react.json",
  "compilerOptions": {
    "baseUrl": ".",
    "paths": {
      "@/*": ["./src/*"],
      "@dbs-portal/core-*": ["../../core/*/src"]
    }
  }
}

Application Packages

{
  "extends": "@dbs-portal/tool-tsconfig/react.json",
  "compilerOptions": {
    "baseUrl": ".",
    "paths": {
      "@/*": ["./src/*"],
      "@dbs-portal/*": ["../../*/src"]
    }
  }
}

Integration with Build Tools

Vite

Works seamlessly with Vite's TypeScript support:

// vite.config.ts
import { defineConfig } from 'vite'
import react from '@vitejs/plugin-react'

export default defineConfig({
  plugins: [react()],
  resolve: {
    alias: {
      '@': path.resolve(__dirname, './src')
    }
  }
})

ESLint

Configure ESLint to use the same TypeScript settings:

// .eslintrc.js
module.exports = {
  parserOptions: {
    project: './tsconfig.json'
  }
}

Scripts

Add to your package.json:

{
  "scripts": {
    "type-check": "tsc --noEmit",
    "type-check:watch": "tsc --noEmit --watch",
    "build": "tsc",
    "build:watch": "tsc --watch"
  }
}

VS Code Integration

Add to your VS Code settings:

{
  "typescript.preferences.includePackageJsonAutoImports": "on",
  "typescript.suggest.autoImports": true,
  "typescript.updateImportsOnFileMove.enabled": "always"
}

Troubleshooting

Path Mapping Issues

If path mapping doesn't work, ensure:

1. baseUrl is set correctly
2. Paths are relative to baseUrl
3. Your bundler supports the same path mapping

Module Resolution

For module resolution issues:

1. Check moduleResolution setting
2. Verify allowImportingTsExtensions setting
3. Ensure bundler compatibility

License

MIT