Solvedts loader typescript v2.1.4 doesn't like empty files in config

Line 49 of config.ts runs afoul of the tsconfig checker in v2.1.4 of the TypeScript compiler:

        configFile = {
            config: {
                compilerOptions: {},
                files: [], // <-------------- THIS LINE
            },
        };

https://github.com/TypeStrong/ts-loader/blob/master/src/config.ts#L49

In my project (https://github.com/danfuzz/quillex), I'm getting the error "error TS18002: The 'files' list in config file 'tsconfig.json' is empty." which I've tracked back to this. (Note: I currently work around this by pointing my project at an older version of typescript.)

If I add a dummy entry to the files list, then typescript stops complaining, and things seem to work as expected, e.g.:

        configFile = {
            config: {
                compilerOptions: {},
                files: ['i-really-hope-you-dont-have-a-file-with-this-name'],
            },
        };

I don't know if this is the best solution to the problem, nor if it causes some other problem that I just haven't noticed yet. For the record, totally removing the files binding causes a different error ("error TS18003: No inputs were found in config file 'tsconfig.json'. Specified 'include' paths were '["**/*"]' and 'exclude' paths were '["node_modules","bower_components","jspm_packages"]'.").

typescript has an explicit error code and message for a specified-but-empty files list, so I'm guessing the change in behavior is intentional.

34 Answers

✔️Accepted Answer

Just ran into this issue and found a solution.

My loaders section in webpack looked like this:

        loaders: [{
                test: /\.ts$|\.tsx$/,
                loader: 'ts-loader',
                options: {
                    configFile: "./tsconfig.server.json"
                }
            },
            {
                test: /\.ejs$/,
                loader: 'ejs-loader'
            }
        ]

Turns out the ./ in the path to the configFile was the issue.

The correct config looks like this:

        loaders: [{
                test: /\.ts$|\.tsx$/,
                loader: 'ts-loader',
                options: {
                    configFile: "tsconfig.server.json"
                }
            },
            {
                test: /\.ejs$/,
                loader: 'ejs-loader'
            }
        ]

Other Answers:

I ran into the same, but in my case my tsconfig.json was in a different directory than the project root, so while a relative path doesn't work:

{
  test: /\.tsx?$/,
  loader: "ts-loader",
  options: {
    configFile: "./foo/tsconfig.json"
  }
}

an absolute path works just fine:

{
  test: /\.tsx?$/,
  loader: "ts-loader",
  options: {
    configFile: path.resolve(__dirname, "foo", "tsconfig.json")
  }
}

I've just stumbled into this error as well, and reason was actually quite different. I passed full path to configFileName property, but it actually takes a name of the file. ts-loader applies tsconfig search logic similar to tsc. Funny thing that it worked quite well on linux and mac, but failed on windows.

(Yeah I get that. I'm not interested in pegging the project to an old version of the compiler.)

I think I'm confused, then. I don't think I'm using ts-loader in an unusual way; that is, I don't get what I'm doing that's different than other users of ts-loader. Like, what should I be doing differently if I want to use TS 2.1?

FWIW, here's where I config ts-loader in my code: https://github.com/danfuzz/quillex/blob/master/server/ClientBundle.js#L93

Just as a coda on this: I figured out what the salient difference is between my situation and other projects'. I'd be surprised if I'm the only one who runs into this, so if nothing else the following can serve as a heads-up.

My project is using TS because it includes the module parchment https://github.com/quilljs/parchment, which is written in TS. Parchment is distributed via npm as a prebuilt JS bundle (built using Webpack) and also includes the original .ts files, but it doesn't include a tsconfig.json file in the npm package. I'm choosing to compile the .ts files (and not use the bundle) because I don't want to have a double layer of Webpack loaders (that is, I'm making my own unified bundle of all the client code). That's why I'm using ts-loader.

So, what ts-loader is getting pointed at is a .ts file which doesn't have a tsconfig.json anywhere around it. This means the getConfigFile() call in ts-loader/config.ts ends up falling through and returning that default one with an empty files list. And it looks to me like any time that that happens, the subsequent attempt to run compilation will fail.

What I can do to work around the problem is add a new tsconfig.json file as a peer to the node_modules directory where parchment lands. (I could also drop one in the parchment directory, but if I do that, I'd no longer be using a pristine package from the npm registry.)

More Issues: