Rails for Front-end Development: Essential Tools/

...

/

TypeScript Configuration Options

TypeScript Configuration Options

Learn how to configure TypeScript.

We'll cover the following...

We now have all the tools we need to discuss the TypeScript configuration.

tsconfig.json file

Here’s our tsconfig.json file, which controls the configuration of our compiler:

Press + to interact
{
  "compilerOptions": {
    "declaration": false,
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "lib": ["es6", "dom"],
    "jsx": "react",
    "module": "es6",
    "moduleResolution": "node",
    "baseUrl": ".",
    "paths": {
      "*": ["node_modules/*", "app/packs/*"]
    },
    "sourceMap": true,
    "target": "es5",
    "noEmit": true
  },
  "exclude": ["**/*.spec.ts", "node_modules", "vendor", "public"],
  "compileOnSave": false
}

The configuration file has two main purposes:

  • Specifying the list of files to compile
  • Specifying the behavior of the compiler itself

We can specify the files using a files property that takes a list of files to compile. Or, we can use include and exclude properties. If you don’t have files or an include, like our project, the default behavior is to compile any .ts or .tsx files that are not on the exclude list.

Both include and exclude can be made of explicit file names, or we can use patterns with ? to match a single character, * to match any characters except directory ...