Standardizing tsconfig.json

This week, I've been creating many typescript applications to test different ways of creating AI chatbots using Model Context Protocol (MCP).

One thing that speeds me through this is that I have a standardized way to create a tsconfig.json so that I'm always at the same starting point. I'm not just copying the last one I used. I know it's not polluted with another project's configuration.

First, I need to make sure that I can get rid of the comments that tsc adds to the generated file. Using strip-json-comments-cli does the trick. I have it in my $HOME/.nvm/default-packages so I don't have to install it each time, but here it is for reference.

npm install -g strip-json-comments-cli

Now, let's create the tsconfig.conf file with some specific parameters. Make sure you have typescript installed.

npx tsc --init --rootDir src --outDir dist \
--esModuleInterop --resolveJsonModule --target es2022 \
--module node16 --moduleResolution node16 --allowJs true --noImplicitAny true

I use dist as my output directory, it's my perference.

Here a bit of the output

{
  "compilerOptions": {
    /* Visit https://aka.ms/tsconfig to read more about this file */

    /* Projects */
    // "incremental": true,                              /* Save .tsbuildinfo files to allow for incremental compilation of project
s. */
    // "composite": true,                                /* Enable constraints that allow a TypeScript project to be used with proj
ect references. */
    // "tsBuildInfoFile": "./.tsbuildinfo",              /* Specify the path to .tsbuildinfo incremental compilation file. */
    // "disableSourceOfProjectReferenceRedirect": true,  /* Disable preferring source files instead of declaration files when refer
encing composite projects. */
    // "disableSolutionSearching": true,                 /* Opt a project out of multi-project reference checking when editing. */
    // "disableReferencedProjectLoad": true,             /* Reduce the number of projects loaded automatically by TypeScript. */

    /* Language and Environment */
    "target": "es2022",                                  /* Set the JavaScript language version for emitted JavaScript and include 

This has too many comments in it, so I get rid of them with strip-json-comments.

cat tsconfig.json | strip-json-comments --no-whitespace | jq -r . > tsconfig.pretty.json && mv tsconfig.pretty.json tsconfig.json

Now, this is way better.

{
  "compilerOptions": {
    "target": "es2022",
    "module": "node16",
    "rootDir": "src",
    "moduleResolution": "node16",
    "resolveJsonModule": true,
    "allowJs": true,
    "outDir": "dist",
    "esModuleInterop": true,
    "forceConsistentCasingInFileNames": true,
    "strict": true,
    "noImplicitAny": true,
    "skipLibCheck": true
  }
}

There is no way to add include and exclude directories using tsc, so I add them with jq.

jq '. + {include: ["src/**/*"], exclude: ["node_modules"]}' tsconfig.json > tsconfig.tmp.json && mv tsconfig.tmp.json tsconfig.json

Now I have a standardized tsconfig.json, and it's all ready to go.

  "compilerOptions": {
    "target": "es2022",
    "module": "node16",
    "rootDir": "src",
    "moduleResolution": "node16",
    "resolveJsonModule": true,
    "allowJs": true,
    "outDir": "dist",
    "esModuleInterop": true,
    "forceConsistentCasingInFileNames": true,
    "strict": true,
    "noImplicitAny": true,
    "skipLibCheck": true
  },
  "include": [
    "src/**/*"
  ],
  "exclude": [
    "node_modules"
  ]
}

Now, I can create a tsconfig.json file for each new project I create.

I've published this on github as a gist.