Type definitions are not generated for library mode build

⚠️ IMPORTANT ⚠️ Please check the following list before proceeding. If you ignore this issue template, your issue will be directly closed.

• Read the docs.
• Use Vite >=2.0. (1.x is no longer supported)
• If the issue is related to 1.x -> 2.0 upgrade, read the Migration Guide first.

Describe the bug

Type definitions are not generated for library mode build

Reproduction

1. Scaffold a react-ts template project.
2. Run build.
3. Check the generated assets.

System Info

• vite version: 2.x
• Operating System: Mac
• Node version: 14+
• Package manager (npm/yarn/pnpm) and version: npm/yarn

[ghost]

This works perfectly fine in Vite. @yyx990803 mentioned --emitDeclarationOnly flag, but as far as I know, you could get some more advanced options using the @rollup/plugin-typescript plugin which is very well documented.

import { defineConfig } from 'vite'
import path from 'path'
import typescript from '@rollup/plugin-typescript'

const resolvePath = (str: string) => path.resolve(__dirname, str)

export default defineConfig({
  build: {
    lib: {
      entry: resolvePath('../src/index.ts'),
      name: 'index'
    },
    rollupOptions: {
      // make sure to externalize deps that shouldn't be bundled
      // into your library
      external: ['vue'],
      output: {
        // Provide global variables to use in the UMD build
        // for externalized deps
        globals: {
          vue: 'Vue'
        }
      },
      plugins: [
        typescript({
          'target': 'es2020',
          'rootDir': resolvePath('../src'),
          'declaration': true,
          'declarationDir': resolvePath('../dist'),
          exclude: resolvePath('../node_modules/**'),
          allowSyntheticDefaultImports: true
        })
      ]
    }
  }
})

In package.json

  "scripts": {
    "build": "vue-tsc --noEmit && vite build"
  },

Then yarn build

This gives me a dist folder containing:

├── client.es.js
├── client.umd.js
├── context
│   ├── app
│   │   └── index.d.ts
│   ├── components
│   │   └── component.d.ts
│   ├── html
│   │   └── index.d.ts
│   ├── layouts
│   │   └── index.d.ts
│   ├── pages
│   │   └── index.d.ts
│   └── plugins
│       └── index.d.ts
├── engine
│   ├── html
│   │   └── index.d.ts
│   ├── layouts
│   │   └── index.d.ts
│   ├── pages
│   │   └── index.d.ts
│   ├── plugins
│   │   └── index.d.ts
│   ├── router
│   │   └── index.d.ts
│   └── socket
│       └── modules
│           └── pty.d.ts
├── favicon.ico
├── index.d.ts
└── style.css

[qmhc]

Currently I use rollup.js to generate d.ts after vite build.

rollup.config.js

import path from 'path'
import typescript from 'rollup-plugin-typescript2'
import json from '@rollup/plugin-json'
import image from '@rollup/plugin-image'
import { nodeResolve } from '@rollup/plugin-node-resolve'
import vue from 'rollup-plugin-vue' // v5.x for vue2
import styles from 'rollup-plugin-styles'
import { createFilter } from '@rollup/pluginutils'

const filter = createFilter(/\.vue$/)

export default {
  input: path.resolve(__dirname, 'src/index.ts'),
  output: {
    file: path.resolve(__dirname, `dist/${name}.dts.js`),
    format: 'es',
    externalLiveBindings: false
  },
  external: [
    // external modules
  ],
  plugins: [
    // create a simple plugin to resect style for .vue file
    {
      name: 'resect-vue-style',
      transform: async (code, id) => {
        if (!filter(id)) return null

        return {
          code: code.replace(/<style.*>[\s\S]*<\/style.*>/ig, ''),
          map: null
        }
      }
    },
    json({ namedExports: false }),
    image(),
    nodeResolve({ preferBuiltins: true }),
    vue({ needMap: false }),
    styles({
      mode: 'extract',
      onExtract: () => false
    }),
    typescript({
      check: true,
      tsconfig: path.resolve(__dirname, 'tsconfig.json'),
      tsconfigOverride: {
        compilerOptions: {
          sourceMap: false,
          declaration: true,
          declarationMap: true
        },
        exclude: ['**/__tests__']
      }
    })
  ]
}

finished then remove the output file path.resolve(__dirname,`dist/${name}.dts.js`).

I make a script build.js

const fs = require('fs-extra')
const path = require('path')
const execa = require('execa')

main()

async function main() {
  await execa('vite', ['build'], { stdio: 'inherit' })
  await execa('rollup', ['-c'], { stdio: 'inherit' })
  await fs.remove(path.resolve(__dirname,`dist/${name}.dts.js`))
}

package.json

{
  "scripts": {
    "build": "node build.js"
  }
}