TypeScript : how to NOT use relative paths to import classes?

In TypeScript, avoid using relative paths for imports by configuring the baseUrl and paths options in the tsconfig.json file. This approach allows you to import modules using absolute paths based on the project root or custom aliases, improving code maintainability and readability. Below are the detailed steps to configure these options:

1. Setting baseUrl

baseUrl is a base directory used to resolve non-relative module names. Setting baseUrl to the project root or the src directory is common.

Example tsconfig.json Configuration:

json
{
  "compilerOptions": {
    "baseUrl": "./src",  // Assuming source files are located in the src directory
  }
}

2. Configuring Aliases with paths

After setting baseUrl, you can use the paths option to define path mappings. These mappings are resolved relative to baseUrl. Using paths allows you to create custom path aliases to avoid complex relative paths.

Example tsconfig.json Configuration:

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

3. Importing Modules with Aliases

After configuring baseUrl and paths, you can import modules using the defined aliases, making the import paths clearer and more concise.

typescript
// Assuming we have a User class in src/models/user.ts
import { User } from '@models/user';

// Import utility functions using aliases
import { calculateAge } from '@utils/calculator';

4. Important Notes

• Ensure that the TypeScript compiler correctly resolves these aliases; you may also need to configure path resolution rules for runtime environments or bundlers (such as Webpack, Jest, etc.).
• For paths configuration, ensure you follow the relative path rules based on baseUrl to avoid import errors.

Summary

By configuring baseUrl and paths in the tsconfig.json file, you can effectively replace complex relative path imports with concise and semantically meaningful path aliases for module imports. This approach not only enhances project maintainability but also improves development efficiency.