Possible to provide path to alternative tsconfig file?

[WonderPanda]

I'm wondering if its possible to explicitly configure Vite to use a tsconfig file of my choosing?

I've looked through the docs and can't find any information in the config API for being able to specify this explicitly.

When working with NX dev tools it is standard to compose your TS settings across multiple files with tsconfig.app.json being the actual entry point that matters for serving/building the application. I'd like to be able to update vite to leverage the configuration defined in tsconfig.app.json instead of automatically picking up tsconfig.json

[sampullman]

We're also interested in this feature, currently our vue3 plugin generates a tsconfig.app.json to align with Nx best practices, but I can't find a way to get it picked up by Vite. Sticking with a tsconfig.json works for my projects, but some users may have more advanced use cases that benefit from splitting it up the way Nx suggests.

[EdieLemoine]

I would love for this to be able to work out of the box, but for now I made a small Vite plugin that works around this. It copies your tsconfig.build.json (customizable) to tsconfig.json before the build, and deletes it after.

vite-plugin-custom-tsconfig

[rosskevin]

I also ended up writing a file swapping plugin to fit our needs: https://github.com/alienfast/vite-plugin-tsconfig

• allows a default tsconfig.json, in the end it will be put back in place
• allows specifying workspaces for monorepo packages to be swapped at the same time as the root

We were dealing with failed CI storybook/vite builds only to learn that vite tries to discover the nearest tsconfig.json at the package.json level regardless if one exists. The readme explains more.

Our use case: the tsconfig.json in our monorepos is setup for development with the use of project references and paths. We use tsconfig.build.json in our CI/production build scripts to build without path dependencies. Vite seems to be coded with no knowledge of a multi-environment type of use case.

[mccolljr]

This has been here for a while... any chance of an official response?

[xenobytezero]

I'd also really like a solution of some kind for this.

I have used it previously as a workaround to the fact that VSCode also doesn't let you configure which tsconfig.json to use for it's internal TS server, which creates some problems as I move from Rollup to Vite.

I was planning to use vite.config.mts as my config file, which means that in order to correctly resolve imports etc I need to include it in my base tsconfig.json. This means that when Vite runs it will compile that file along with the rest of my source, dumping it in my dist folder, as well as screwing up my output folder layout, etc.

• I can use rootDir, but it throws up a bunch of warnings doing this that I'd rather not see to not freak out other devs.
• I can't use the plugins mentioned here since I need to keep a real tsconfig in the root for VSCode purposes.

Solutions/thoughts would be useful.

[Shakeskeyboarde]

I haven't tried it, but would setting the Vite esbuild.tsconfig option work?

[FranciscoKloganB]

Esbuild only works for development. Vite should accept tsConfig paths for any environment. :\

[ShGKme]

There is no esbuild.tsconfig option in Vite.

[JannieT]

I got it working using the vite-plugin-dts plugin:

import { defineConfig } from 'vite';
import dts from 'vite-plugin-dts';

export default defineConfig({
 plugins: [
    dts({
      tsconfigPath: 'tsconfig.frontend.json'
    })
  ],
  ...

[ZuBB]

Prod mode fails with this for me

[wangpin34]

my case is a little bit different. i have lots of test file written in typescript and i'ld like to exclude those test files when typescrpt compiler does the type check:

tsc && vite build

And I still need typescript type check works when edit/view the files. So the expect behavior is remain all the files are type checked(no exclude in tsconfig.json) and exclude those test files in build time.

In the begining I was trying to filter to how to add the exclude list in the vite config like methioned above using a plugin. I tried but still didn't work so I gave it up. And then I realized it is typescript which should do this. So it ended as:

tsconfig.json -> no exclude
tsconfig.build.json -> extends tsconfig.json and add exclude.

{
  "extends": "./tsconfig.json",
  "exclude": ["src/**/*.test.ts", "src/**/*.test.tsx"]
}

and the build script is updated as:
package.json

"build": "bash ./build.sh",

build.sh:

export PATH=node_modules/.bin:$PATH
tsc --project ./tsconfig.build.json && vite build

Read more about --project option of tsc cli

--project
Compile the project given the path to its configuration file, or to a folder with a 'tsconfig.json'.

[alecgibson]

tl;dr:

// vite.config.js
export default defineConfig({
  optimizeDeps: {
    esbuildOptions: {
      configName: 'tsconfig.app.json',
    },
  },
});

This is probably extremeley fragile Dark Magic, which I found by rummaging around in the vite source code. It has presumably been omitted from the documented API for Good Reasons, so use at your own risk. Thought I'd share this here in case it helps someone else in a pinch.

Under the hood:

• vite's esbuild plugin uses parse() to read tsconfig.json
• parse comes from the tsconfck library
• internally, tsconfck will read the configName option (or default to tsconfig.json), so you can set the file you're looking for with this option

[th0r]

Doesn't work for me: node_modules/esbuild/lib/main.js:259:12: ERROR: Invalid option in context() call: "configName"

[TyIsI]

@alecgibson which version of vite are you using? I think @th0r might be on a newer version than you?

[alecgibson]

The links I provided above are all permalinks. Looks from browsing the repo at that commit that it was vite@6.1.0-beta.0. I'm not actually using this solution in the end (it was too hacky even for me!), so I have no idea if it's still working in the latest version.

[rosskevin]

I can confirm that this type of config is working in vite 7.1.5:

  optimizeDeps: {
    esbuildOptions: {
      // https://esbuild.github.io/api/#tsconfig
      tsconfig: isCI() ? 'tsconfig.build.json' : 'tsconfig.json',
    },
  }

[rosskevin]

I spoke too soon, for monorepo packages, it seems that vite is still hunting for the nearest tsconfig.json, even if at the top it is using the correct one. So CI builds fail for me when I run storybook+vite. So, I'm back to doing swaps of configs.