What is the correct way to import a file in typescript?

Question

historically when importing javascript files, you name the file index.js and then import like so

import something from 'components/path/something' where the last something is a directory with the index.js file in

but with TS I get an error saying: no file or directory when I switch the file name to index.ts

2 solutions so far import something from 'components/path/something/index.ts'

or

import something from 'components/path/something/something'

not a huge fan of either, is there a better approach to this?

Answer 1

There is no correct way:

Imports are usually relative:

import whatever from '../another/folder/'; // will import index

Of course you can adapt this behavior in tsconfig.json:

{
  ....
  "compilerOptions": {
    "baseUrl": "src",
    "paths": {
      "@services/*": ["services/*"],
      "@shared/*": ["shared/*"],
      "@models/*": ["models/*"],
    },
    ...
  }
}

Provides you an "absolute project path":

import WhateverService from '@services/WhateverService';

https://www.typescriptlang.org/docs/handbook/modules.html