Declaration generated in wrong folder when using object as `input` (multi-entry)

[benkeen]

What happens and why it is wrong

Possibly this is a misconfiguration on my end, but it looks like a bug. When you use an object as the input property for the rollup configuration, the typings file for the input files are generated in the root folder of the repo (same folder as the rollup config file) and not the target output directory (here, ./dist) along with the bundled JS file.

Versions

• typescript: 3.2.4
• rollup: 1.1.2
• rollup-plugin-typescript2: 0.19.2

rollup.config.js

{
    ...
    input: {
        Lib1: './src/Lib1.tsx',
        Lib2: './src/Lib2.tsx'
    },
    output: {
        dir: './dist',
        format: 'cjs',
        sourcemap: true,
        entryFileNames: '[name].js'
    }
}

tsconfig.json

{
  ...
  "compilerOptions": {
    "outDir": "./dist"
  },
}

Result:

// These files are created
./Lib1.d.ts
./Lib2.d.ts

// instead of (expected):
./dist/Lib1.d.ts
./dist/Lib2.d.ts

Curiously, if you enter entryFileNames: 'dist/[name].js' it creates a superfluous subfolder called dist within the dist folder and creates them there.

[jakearchibald]

The useTsconfigDeclarationDir plugin option is a workaround for now.

[ezolenko]

This might be fixed by #142, released in 0.20.0

[benkeen]

Hi @ezolenkom & @jakearchibald, no luck on either actually.

When adding the useTsconfigDeclarationDir option in my rollup plugin the declaration files are no longer created at all. And updating to 0.20.1 didn't make a difference, unfortunately.

[ezolenko]

@benkeen when using useTsconfigDeclarationDir: true plugin option you also need to have declarationDir value in tsconfig.json

[AntonPilyak]

have similar trouble, my project layout is like this:

export default [ 
  {
    input: 'src/subFolder1/one.ts',
    output: [
                    {
                      file: 'dist/one.js'
                      // .....                      
                     }
    ],
    plugins: [
           typescript({
                typescript: require('typescript'),
            }),
    ]
  }, {
      input: 'src/subFolder2/two.ts',
      output: [
                    {
                      file: 'dist/two.js'
                      // .....                      
                     }
    ],
    // ...
  },
]

As an output I have:

dist
  |---subFolder1
  |          |--------one.d.ts
  |
  |---subFolder2
  |          |---------two.d.ts
  |-----one.js
  |-----two.js

[ezolenko]

Works for me on 0.20.1 with useTsconfigDeclarationDir: false -- d.ts files go into the folders specified in output.[].dir. @benkeen could you try again?

@AntonPilyak that is by design -- if d.ts were going into one folder without sub paths, then if you had subFolder1/one.ts and subFolder2/one.ts, one of those would be overwriting another.

[AntonPilyak]

@ezolenko : this feature, I think, creates more inconveniences rather then solves a real problem (due to it is hard to maintain all those directory structure). I have to create a script that copies all these type declarations to the root of the bundle, and add the directories to .npmignore in order to create a bundle that is easy to include. I would suggest you to create these additional directories ONLY for the type files with the same names. And use a directory defined in 'output' section of rollup.config.json for the rest.

[ezolenko]

@AntonPilyak you might be able to use useTsconfigDeclarationDir: true option, setup declarationDir in tsconfig, this should let typescript itself handle the typings output paths.

[ezolenko]

Deciding if subdirectories should be used based on uniqueness of the paths would be a nightmare in an evolving project, suddenly your typing would move to a subfolder only because you added a new file with the same name in a different folder.

Normally if you want pretty typings you will want to merge them into one file anyway (there was an npm module I keep forgetting the name of for that)

[maranomynet]

I am using version 0.22.0 and I have pretty much the same problem as @AntonPilyak

{
    // ...
    input: {
        foo: 'src/lorem/foo.ts',
        bar: 'src/ipsum/bar.ts'
    },
    output: {
        dir: 'dist',
        format: 'cjs',
        sourcemap: true,
    }
}

And I get this out:

dist/
    lorem/
        foo.d.ts
    ipsum/
        bar.d.ts
    foo.js
    foo.js.map
    bar.js
    bar.js.map

Obviously, I'd like the *.d.ts files to sit alongside the *.js and *.js.map files.

I've tried fiddling with useTsconfigDeclarationDir and declarationDir to no avail.

The definition files always end up inside lorem and ipsum sub-folders respectively, and never in a flat list.

[maranomynet]

Moreover it seems like it creates declaration files for every .ts file it finds, not just the entry points.

dist/
    lorem/
        foo.d.ts
    ipsum/
        utils/
            bar-helper.d.ts
        bar.d.ts
     some_other_ts_file/
         not_imported_by/
             neither_foo_nor_bar/
                  wat.d.ts
    foo.js
    foo.js.map
    bar.js
    bar.js.map

I've tried scoping options.tsconfigOverride.input to just the entry points, but that seems to have no effect whatsover. In fact I'm not even sure if tsconfigOverride.input works at all.

This is all a bit confusing.

...

I mean, fair enough if it needs to create a declaration file for utils/bar-helper.ts but at least wat.ts should be left out of the whole thing.

[ezolenko]

Yeah, it generates declarations for all files found by tsconfig, if you don't want particular file touched, make sure it is excluded or not included in tsconfig. To see list of files found by typescript, run plugin with verbosity 3 and look for "parsed tsconfig" entry.