TS-Errors when building with Vite `v5.3.1`

[razorness]

TS-Errors when building with Vite `v5.3.1`

[luckylark2000]

hello, today I meet the same problem with you。I solve it by a few steps that I hope my solution can help you or give you some light or tips。My English is poor , but I will try my best to explain it hhh。as follows :

environment

I introduce my environment as I meet the problem that similar with yours : my root files about tsconfig have three, all of three are : tsconfig.json, tsconfig.app.json, tsconfig.node.json。and my tsconfig.json ( the remaining two is not important for this plugin ) source code is :

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

solve

OK let's solve the problem :

1. new a file named tsconfig.build.json in root content the content as follows:

{
  "extends": "@vue/tsconfig/tsconfig.dom.json",
  "include": ["env.d.ts", "src/**/*", "src/**/*.vue"],
  "compilerOptions": {
    "baseUrl": ".",
    "paths": {
      "@/*": ["./src/*"]
    }
  },
  "references": [
    {
      "path": "./tsconfig.node.json"
    },
    {
      "path": "./tsconfig.app.json"
    }
  ]
}

2. add options to dts( ) in vite.config.ts plugins. just like this :

plugins: [
    vue(),
    vueJsx(),
    dts({
      tsconfigPath: './tsconfig.build.json',
    }),
  ],

3. then you can run your build command , probably your problem will solved.

explain

Now I explain why do this will work :
I see the READMME.md file about options, in export interface PluginOptions it has this :

/**
   * Specify tsconfig.json path
   *
   * Plugin resolves `include` and `exclude` globs from tsconfig.json
   *
   * If not specified, plugin will find config file from root
   */
  tsconfigPath?: string,

it mean's dts( ) default resolves include and exclude globs from tsconfig.json but look the tsconfig.json in your tsconfig.json most probably it don't have( except the reference ) so the plugin don't work and cause problem. so I create a new file tsconfig.build.json, almost copy the content of the tsconfig .json ,just add some include and compilerOptions. so it works.

more tips

if you use

 "paths": {
      "@/*": ["./src/*"]
    }

in your tsconfig.build.json then in your project you don‘ use relative path such as . / type ,please use @/... to replace all of them , this plugin works with the paths configure as some rules I guess.

all in all, good luck to you , hope you will solve your problem