---
title: "tsconfig.json"
description: "Learn how Nuxt manages TypeScript configuration across different parts of your project."
canonical_url: "https://nuxt.com/docs/4.x/directory-structure/tsconfig"
---
# tsconfig.json

> Learn how Nuxt manages TypeScript configuration across different parts of your project.

Nuxt [automatically generates](https://nuxt.com/docs/4.x/guide/concepts/typescript#auto-generated-types) multiple TypeScript configuration files (`.nuxt/tsconfig.app.json`, `.nuxt/tsconfig.server.json`, `.nuxt/tsconfig.node.json` and `.nuxt/tsconfig.shared.json`) that include recommended basic TypeScript configuration for your project, references to [auto-imports](https://nuxt.com/docs/4.x/guide/concepts/auto-imports), [API route types](https://nuxt.com/docs/4.x/guide/concepts/server-engine#typed-api-routes), path aliases, and more.

Your Nuxt project should include the following `tsconfig.json` file at the root of the project:

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

::warning
We do not recommend modifying the contents of this file directly, as doing so could overwrite important settings that Nuxt or other modules rely on. Instead, extend it via `nuxt.config.ts`.
::

::read-more{to="https://nuxt.com/docs/4.x/guide/concepts/typescript#project-references"}
Read more about the different type contexts of a Nuxt project here.
::

## Extending TypeScript Configuration

You can customize the TypeScript configuration of your Nuxt project in the `nuxt.config.ts` file: set shared `compilerOptions` for every context at once with `typescript.tsConfig`, and override them for each context (`app`, `shared`, `node`, and `server`) individually.

```ts [nuxt.config.ts]twoslash
// @errors: 2353
export default defineNuxtConfig({
  typescript: {
    // shared compiler options for every generated tsconfig
    tsConfig: {
      compilerOptions: {
        // ...
      },
    },
    // customize tsconfig.app.json
    appTsConfig: {
      // ...
    },
    // customize tsconfig.shared.json
    sharedTsConfig: {
      // ...
    },
    // customize tsconfig.node.json
    nodeTsConfig: {
      // ...
    },
    // customize tsconfig.server.json
    serverTsConfig: {
      // ...
    },
  },
})
```

::note
Most `compilerOptions` set in `typescript.tsConfig` are shared with every context, but a few are not. DOM- and Vue-specific options (such as `lib`, `jsx` and `jsxImportSource`) only make sense for your application code, so they are applied to `tsconfig.app.json` alone. Nuxt also manages `types`, `paths` and `noEmit` per context (the `node`, `shared` and `server` configs deliberately emit nothing and scan no ambient types), so setting these in `typescript.tsConfig` will not change them. Use the matching per-context option (`appTsConfig`, `nodeTsConfig`, `sharedTsConfig` or `serverTsConfig`) when you need to override them.
::

::note
`typescript.serverTsConfig` extends `tsconfig.server.json`. `nitro.typescript.tsConfig` is kept in sync with it but is deprecated, so set `typescript.serverTsConfig` instead.
::


## Sitemap

See the full [sitemap](https://nuxt.com/sitemap.md) for all pages.
