How to generate only 1 declaration file instead of multiple identical d.ts with multiple outputs?

I’m using rollup to bundle my code with dual cjs/esm output. As you can expect, my setup is a single input multiple output configuration.

{
  "input": "source/index.ts",
  "output": [
    {
      "file": "lib/index.mjs",
      "format": "es",
      "sourcemap": true
    },
    {
      "file": "lib/index.cjs",
      "format": "cjs",
      "sourcemap": true
    }
  ]
}

The plugin works just fine. The only expected thing is that 2 identical d.ts files (index.d.ts & index.cjs.d.ts) are generated per output. index.cjs.d.ts is reductant and I want to get rid of it but I cannot find any options to generate the declaration file once. Any hint?

[wessberg]

Because this plugin is invoked and operates per output, the content of the emitted files may change depending on the output and the output options. The same goes for the declaration files. For example, because rollup-plugin-ts supports code splitting inside your declaration files, in such scenarios, module specifiers within import declarations across your declaration files will be different for each bundle.

However, in practice, outside of code splitting, and unless you’re doing fancy stuff with your outputs, the declaration files will most often be identical for each output. In such scenarios, while you can’t make rollup-plugin-ts only generate them once, you can make it only emit one of them by making sure they’re identically named.

Here’s a few ways I’ve seen others solve this in the past.

First, if the two .js files have different names, for example index.cjs.js and index.esm.js, then you can use the outputPath hook to rewrite the name of the declaration file to something you’d like:

ts({
  // ...
  hook: {
    // Always rename declaration files to index.d.ts to avoid emitting two declaration files with identical contents
    outputPath: (path, kind) => kind === "declaration" ? "./dist/index.d.ts" : path
  }
})

Alternatively, if your two .js files have identical names and you instead have an output structure that looks something like this:

dist
-> esm
     -> index.js
     -> index.d.ts
-> cjs
     -> index.js
     -> index.d.ts
         

…And you want for it to be something like this:

dist
-> index.d.ts
-> esm
     -> index.js
-> cjs
     -> index.js

…Then all you have to do is go to your tsconfig.json and add "declarationDir": "dist" to your compiler options, as the two declaration files will be equally named and only one will be emitted.

I may be open to doing some heuristic where if I can gather based on the Rollup- and plugin options that we’re in a single-file bundling type of scenario where the corresponding declaration file for each output will most likely be completely identical, I will apply an optimization such that they are only generated once.

[thekevinbrown]

It’s a separate issue, which I’ve raised here: https://github.com/wessberg/rollup-plugin-ts/issues/151