Fix - An import path cannot end with a '.ts' extension in TS

avatar

Borislav Hadzhiev

Mon Mar 14 20222 min read

banner

Photo by Coco Winter

Fix - An import path cannot end with a '.ts' extension in TS #

The error "An import path cannot end with a '.ts' extension" occurs when we include the extension when importing TypeScript files. To solve the error, remove the extension from your TypeScript imports.

Here is an example of how the error occurs.

index.ts
// ⛔️ Error: An import path cannot end with a '.ts' // extension. Consider importing './another-file' instead.ts(2691) import { sum } from './another-file.ts';

To solve the error, remove the .ts extension when importing files.

index.ts
import { sum } from './another-file';

The TypeScript compiler does not change import specifiers when transpiling your TypeScript code to JavaScript, so if you had an import like import {sum} from './another-file.ts', the path would remain with a .ts extension even after compilation.

An alternative approach, if you use webpack, is to try adding the extensions you need to resolve to your webpack.config.js file.

webpack.config.js
module.exports = { //... rest resolve: { extensions: ['.js', '.jsx', '.ts', '.tsx'], }, };

If you use Deno, you have to specify extensions when importing files, so you have 2 options:

  • Install the VSCode extension for Deno
  • Use // @ts-ignore comments above your imports
If you use VSCode for your code editing, install the Deno extension and the error should be resolved.

If this still doesn't work for you, you have to use // @ts-ignore comments above the imports to ignore the error.

index.ts
// @ts-ignore import { sum } from './another-file.ts';

If you have a linter rule that doesn't allow you to use TS comments in your code, you can disable it for the file.

index.ts
/* eslint-disable @typescript-eslint/ban-ts-comment */ // @ts-ignore import { sum } from './another-file.ts';

Or you could disable it in your eslintrc file.

.eslintrc
{ "rules": { "@typescript-eslint/ban-ts-comment": "off" }, }

There is a Github issue regarding the ability to suppress the "An import path cannot end with a '.ts' extension" error, but there hasn't been much movement in the past 4 years.

Use the search field on my Home Page to filter through my more than 1,000 articles.