# .app/tsconfig.app.json

Use the TypeScript configuration generated by Runable and extend it only when the project needs to.

Runable generates this configuration with `runable prepare`. It covers Vue components, `app/` sources, and declarations produced in `.app/`.

It configures strict mode, `Bundler` resolution, browser libraries, Vue JSX, `noEmit`, project aliases, and `#build/*`.

Run `runable prepare` before the first type check. This command generates declarations for routes, components, layouts, plugins, and auto-imports.

::u-tip
---
variant: warning
title: Do not edit the generated file
---

Runable may rewrite `.app/tsconfig.app.json`. Direct customizations will be lost during the next preparation.

::

## Recommended minimal configuration

When the generated settings suit your project, reference the file directly from `tsconfig.json`:

```json
{
  "files": [],
  "references": [
    { "path": "./.app/tsconfig.app.json" },
    { "path": "./tsconfig.node.json" }
  ]
}
```

In this case, do not create a root `tsconfig.app.json`.

## Add project options

Create a root file only when the application needs additional options:

```json
{
  "extends": "./.app/tsconfig.app.json",
  "compilerOptions": {
    "exactOptionalPropertyTypes": true
  }
}
```

Then update the root reference:

```json
{
  "files": [],
  "references": [
    { "path": "./tsconfig.app.json" },
    { "path": "./tsconfig.node.json" }
  ]
}
```

Keep this layer short. Do not duplicate aliases or files already included by Runable.