Why must I import TS files as JS files in this case? – Typescript

by
Ali Hasan
react-typescript webdriver-io

Quick Fix: To resolve this issue, add the allowImportingTsExtensions property to your tsconfig.json file, ensuring that the noEmit property is also set to true. This will allow you to import TypeScript files as JavaScript files.

The Problem:

In a WebdriverIO testing project using TypeScript, TS module resolution works during compilation but fails at runtime when using regular TS module imports. The project must import TS files as JS files, which is unusual in TypeScript development. The cause and justification for this anomaly need to be clarified.

The Solutions:

Solution 1: allowImportingTsExtensions

To resolve the issue where TS modules were not being resolved correctly during runtime, the `allowImportingTsExtensions` flag was added to the `tsconfig.json` file.

This flag allows importing TS files as JS files, which is necessary in this case because WDIO imports TS modules as JS modules. Additionally, the `noEmit` flag was also set to true, as `allowImportingTsExtensions` can only work in conjunction with `noEmit`.

With these changes, the TS modules can be imported correctly and the runtime error is resolved.

Q&A

Why must I import TS files as JS files in this case?

It solved by adding allowImportingTsExtensions in tsconfig.json.

Video Explanation:

The following video, titled "'.js' files in TypeScript - why?! - YouTube", provides additional insights and in-depth exploration related to the topics discussed in this post.

Play video

I'm surprised that the TS team don't let you simply import .ts and then have TSC compile the imports out as .js. Guessing they have their ...