Multiple tsconfig
TL;DR: Webstorm doesn't seem to support separate tsconfig files for application code and test code if test code is kept next to its application code files.
I read the post here by Daniel West asking about multiple TSConfig files when you have server and client code in the same project.
My scenario is a bit different. I have a tsconfig.json file that builds my application code and I have a tsconfig.spec.json configuration that layers in test code during development. My test files are in the same directories with my application code... for example:
/project
/src
some-code.ts
some-code.spec.ts
/spec
/helpers
some-test-setup.ts
/support
jasmine.json
tsconfig.json
tsconfig.spec.json
tslint.json
tslint.spec.json
(I have my linting setup in a similar way since my tests allow some lint rules to be broken to simplify testing in ways that I don't want allowed in my application code -- because of a similar problem to what's happening with tsconfig, I have disabled inspection because it misreports a bunch of lint errors in my test code).
In the post above mentioned post, Elena Pogorelova commented that Webstorm uses the tsconfig file closest to the code being compiled. The problem with my scenario is that's not helpful.
As a result, Webstorm is misreporting that my *.spec.ts files have errors wherever I use Promises. For example, if I use `Promise.resolve()` in a test, I get "Error:(17, 16) TS2693:'Promise' only refers to a type, but is being used as a value here."
I'm assuming this is because the spec files are specifically excluded in my tsconfig.json file:
{
"compilerOptions": {
"module": "commonjs",
"target": "es6",
"declaration": true,
"noImplicitAny": false,
"sourceMap": true,
"removeComments": true,
"noLib": false,
"experimentalDecorators": true,
"emitDecoratorMetadata": true,
"outDir": "dist"
},
"include": [
"src/**/*"
],
"exclude": [
"node_modules",
"src/**/*.spec.ts",
"spec/**/*"
]
}
But they are included when I compile my tests using tsconfig.spec.json:
{
"compilerOptions": {
"module": "commonjs",
"target": "es6",
"declaration": true,
"noImplicitAny": false,
"sourceMap": true,
"removeComments": true,
"noLib": false,
"experimentalDecorators": true,
"emitDecoratorMetadata": true,
"outDir": "dist"
},
"include": [
"spec/**/*",
"src/**/*.spec.ts"
]
}
Is there a way to tell Webstorm to use tsconfig.spec.json for `**/*.spec.ts`, but use tsconfig.json for everything else?
Alternatively, is there a way to disable specific errors in a file type (*.spec.ts)? This is a less ideal option.
Thanks
Please sign in to leave a comment.
tsconfig.spec.json file is ignored - tsserver only considers tsconfig.json files, all other files with names not exactly matching this pattern are not treated as configuration files. So, as the IDE fails to find a tsconfig.json where your spec files are included, it uses default settings to process your specs
As your spec files live in a separate folder, I'd suggest creating tsconfig.json file with test-specific settings in this folder - it will be used for spec files
Hi Elena, thanks for the quick reply.
If you look at the examples I've included above, you'll see that my *.spec.ts files are in the same folders as my *.ts files, so I can't do what you're suggesting, which is what makes it different than the scenario I linked from Daniel West (to which you responded with the exact same solution - it doesn't work in my scenario)... This is a pretty common pattern. The `spec/` folder is part of the test build, but it only contains test configuration... the problem seems to be that my tsconfig files excludes *.spec.ts, because that's handled by tsconfig.spec.json.
Bump. Running into the exact same issue as OP. We're using Jest, and our test files are living *next to* the source files;
One workaround is to have the main tsconfig.json be specified for test files, while you have a tsconfig-build.json for all production code. This requires you to explicitly specify the build config in your build command:
This workaround pollutes my project with IDE specific quirks (the fact that Webstorm only recognizes tsconfig.json), while I prefer to work around those quirks within the settings of my IDE, like manually specifying which config file to use. Actually, this kind of workflow is supported for TSLint, where it defaults to tslint.json, but allows you to specify the config file if you need.
Would love to see a solution to this issue.
Please follow https://youtrack.jetbrains.com/issue/WEB-28091 for updates
> Please follow https://youtrack.jetbrains.com/issue/WEB-28091 for updates
I don't see how that issue is related, and it's closed.
WebStorm still cannot work with multiple tsconfig files in the same directory, while VSCode can read them perfectly. There is a variety of use cases for wanting to do this.
The comment you refer to was submitted in 2017. And this feature is already there, WebStorm does support multiple configuration files: the built-in compiler service uses the nearest
tsconfig.*.jsonfile the current *.ts file is included in, traversing the folders tree up to the project root.tsconfig.*.jsonhere is a file with a name matching one of the patterns configured in Settings | Editor | File Types | TypeScript Config file typeCan it? https://github.com/microsoft/TypeScript/issues/8435
Well, at least VSCode correctly determines the files matching a specific tsconfig based on the `files`, `include`, and `exclude` rules, not a brute force approach with lots of false positives like WS does :/
WebStorm also uses `files`, `include` and `exclude` rules to find a nearest config the file belongs to. If this doesn't work for you, please share a sample project that reproduces the issue
Man i just love the work you guys and girls do for the code editors. Thanks, i had a custom name on my tsconfig file. By adding `tsconfig.name.json` made it respect the tsconfig file settings for me.
For others don't forget to add these tsconfigs as references in the file or extend them properly. I have failed with that so many times already :P