Typescript+webpack: typescript emmited no output for index.d.ts

Question

I followed this tutorial to setup typescript+webpack (no react) with success. It all works great until I add index.d.ts file my components folder, which I use to export all my modules, like:

export * from "./MyClass1";
export * from "./MyClass2";
export * from "./MyClass2";

Then I import it:

import * as MyLib from "./components";

Code hinting and everything works fine in sublime editor.

Initially, when I run it, I've got:

Cannot resolve 'file' or 'directory' ./components

So I added d.ts to extensions in webpack.config.js:

 resolve: {
        extensions: ["", ".webpack.js", ".web.js", ".ts", ".tsx", ".js", ".d.ts"]
    },

Now, when I run webpack, I get this error:

Typescript emitted no output for [...]\index.d.ts

How should I solve this problem?

Answer 1

In this particular question the content of index.d.ts was not a definition but a module and should have been moved into index.ts file. I've also ran into error "typescript emmited no output for index.d.ts" but with valid declaration files.

It seems ts-loader tries to add .d.ts files to final bundle but finds nothing to add since they contain only declarations needed for type-checking during build.

Working solution for me is not to pass .d.ts files to ts-loader but to some loader that does nothing, e. g. ignore-loader. Corresponding rules in my webpack.config.js are:

{
    test: /\.tsx?$/,
    loader: 'ts-loader',
    exclude: /node_modules|\.d\.ts$/
},
{
    test: /\.d\.ts$/,
    loader: 'ignore-loader'
},

ts-loader can be configured slightly differently if you use ES2018, where negative lookbehind for regular expressions was added:

{
    test: /(?<!\.d)\.tsx?$/,
    loader: 'ts-loader',
    exclude: /node_modules/
},
//same ignore-loader config here

Answer 2

index.d.ts

This is a declaration file. A declaration file has no javascript emit.

Fix

Make sure that the .d.ts file is not a part of the required emit by excluding it from webpack e.g. by redirecting it to ignore-loader

{
    test: /\.tsx?$/,
    loader: 'ts-loader',
    exclude: /node_modules|\.d\.ts$/
},
{
    test: /\.d\.ts$/,
    loader: 'ignore-loader'
},