Typescript Configuration (tsconfig.json)

Zuplo projects use Typescript for custom code. At the root of every project is a tsconfig.json file that specifies the configuration for the Typescript compiler. This file is used by the Typescript compiler to compile the Typescript code into Javascript.

This file is automatically generated by Zuplo and should not be modified. If you do modify the file, you will receive build warnings indicating the settings that have been changed.

When developing in the Zuplo Portal or running the zuplo dev command locally, the build will automatically fix this file for you. If you were using unsupported settings, the modifications to this file may cause the build to fail. If this happens, we recommend that you fix your code instead of reverting the changes to the tsconfig.json file.

The recommended tsconfig.json file is shown below.

{
  "include": ["modules/**/*", ".zuplo/**/*", "tests/**/*"],
  "exclude": ["./node_modules", "./dist"],
  "compilerOptions": {
    "module": "ESNext",
    "target": "ES2022",
    "lib": ["ESNext", "WebWorker", "Webworker.Iterable"],
    "preserveConstEnums": true,
    "moduleResolution": "Bundler",
    "useUnknownInCatchVariables": false,
    "forceConsistentCasingInFileNames": true,
    "importHelpers": true,
    "removeComments": true,
    "esModuleInterop": true,
    "noEmit": true,
    "strictNullChecks": true,
    "experimentalDecorators": true
  }
}

Updating the tsconfig.json File#

The tsconfig.json file is not shown in the Zuplo Portal. If you need to update it you can do so connecting your project to Source Control and editing the file in your source control provider or locally.

Troubleshooting#

This section contains common issues that you may encounter if you have used unsupported settings in the tsconfig.json file and are migrating to the recommended configuration.

Build Warning: This project's tsconfig.json was not set to the recommended settings. Custom settings may cause build issues.#

Build Warning

This warning is shown when the tsconfig.json file is not set to the recommended settings. If you see this warning, but your build is successful, then you aren't required to do anything. However, we still encourage you to update your tsconfig.json file to the recommended settings. This will ensure that your build continues to work in the future and that you do not encounter any issues.

Note

Depending on when your project was created, you might see this warning even if you never edited the tsconfig.json file. Older project templates used various different configurations in the tsconfig.json. This warning is just telling you that your settings are different from the current recommended settings.

Build Error: Could not resolve "modules/my-module"#

If you have a module that is not being resolved and the module does not start with a path indicator like ./ or ../, you either need to change the import to use the path indicator or add a paths setting to your tsconfig.json file.

For example, if you have the following import:

import { myFunction } from "modules/my-module";

You can either change the import to:

import { myFunction } from "./modules/my-module";

Or add the baseUrl and paths setting to your tsconfig.json file:

{
  "compilerOptions": {
    "paths": {
      "modules/*": ["./modules/*"]
    }
  }
}