RodBe: Shareable TypeScript Configurations 🧙‍♂️

Overview

This package provides shareable TypeScript configuration files to be extended in a TypeScript v5 project. It is structured to support different environments with specific TypeScript compiler options.

Pre-requisites

• TypeScript >= 5.0.0

Exported Configurations

The package.json exports many configurations that can be used depending on the needs of your project:

This package exposes 6 configuration paths whose relationship is as follows:

graph TD
  Base["@rodbe/tsconfig/agnostic"]

  DomReact["@rodbe/tsconfig/<br/>bundler/dom/app/react"]
  DomNextJs["@rodbe/tsconfig/<br/>bundler/dom/app/next"]
  DomLib["@rodbe/tsconfig/<br/>bundler/dom/lib"]
  NoDomLib["@rodbe/tsconfig/<br/>bundler/no-dom/lib"]
  NoDomApp["@rodbe/tsconfig/<br/>bundler/no-dom/app"]

  DomNextJs -->|extend| Base
  DomReact -->|extend| Base
  NoDomLib -->|extend| Base
  NoDomApp -->|extend| Base
  DomLib -->|extend| Base

By environment

| Type | Description | Example | |--------|-----------------------------------------------|--------------------------------------------------------------------| | DOM | Environments where DOM types are required | Web application like vanilla, react, etc Web Module like libraries | | NO-DOM | Environments where DOM types are not required | Node.js server-side applications. |

Use cases

| Compiler | Type | Application | How to import? | Example | |----------|--------|-------------|------------------------------------------|----------------------------------| | Any | BASE | Any | @rodbe/tsconfig/agnostic | Use as base for any TS Project | | Bundler | DOM | App | @rodbe/tsconfig/bundler/dom/app/react | React | | Bundler | DOM | App | @rodbe/tsconfig/bundler/dom/app/next | Next.js | | Bundler | DOM | Lib | @rodbe/tsconfig/bundler/dom/lib | JS module | | Bundler | NO-DOM | App | @rodbe/tsconfig/bundler/no-dom/app | CLI | | Bundler | NO-DOM | Lib | @rodbe/tsconfig/bundler/no-dom/lib | Node.js module |

Usage

You can extend these configurations in your tsconfig.json file like so:

{
  // extends the appropriate configuration based on your needs (see above "how to import" col)
  "extends": "@rodbe/tsconfig/bundler/no-dom/app",
  "compilerOptions": {
    "baseUrl": ".",
    // Your custom options
  }
}

For React

{
  // extends the appropriate configuration based on your needs (see above "how to import" col)
  "extends": "@rodbe/tsconfig/bundler/dom/app/react",
  "compilerOptions": {
    "baseUrl": ".",
    "types": ["vite/client", "react", "node"] // if you use vite
    // Your custom options
  }
}

For Next.js

{
  // extends the appropriate configuration based on your needs (see above "how to import" col)
  "extends": "@rodbe/tsconfig/bundler/dom/app/next",
  "compilerOptions": {
    "baseUrl": "."
    // Your custom options
  },
  "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx", ".next/types/**/*.ts"]
}

Make sure to choose the appropriate configuration based on whether you need DOM types or not.

Additional Information

• Homepage: GitHub Repository
• Issues: Report Issues
• License: MIT