Why my custom typescript alias is not working?

Question

I am creating a MERN Stack college project so i am using typescript in backend.

In tsconfig.json i am using some custom alias for file navigation.

my tsconfig.json :

{
  "compilerOptions": {
    "target": "es2018",
    "module": "commonjs",
    "strict": true,
    "esModuleInterop": true,
    "skipLibCheck": true,
    "forceConsistentCasingInFileNames": true,
    "moduleResolution": "node",
    "resolveJsonModule": true,
    "outDir": "dist",
    "paths": {
      "@controllers/*": ["./src/controllers/*"],
      "@models/*": ["./src/models/*"],
      "@routes/*": ["./src/routes/*"],
      "@customTypes/*": ["./src/customTypes/*"],
      "@databases/*": ["./src/databases/*"],
      "@functions/*": ["./src/functions/*"],
      "@middlewares/*": ["./src/middlewares/*"]
    }
  },
  "exclude": ["node_modules"]
}

but after i start the development server this error occur:

[INFO] 00:06:56 ts-node-dev ver. 2.0.0 (using ts-node ver. 10.9.1, typescript ver. 5.1.6)
Error: Cannot find module '@routes/login'
Require stack:
- D:\Projects\sd-college\server\src\index.ts
    at Function.Module._resolveFilename (node:internal/modules/cjs/loader:1077:15)
    at Function.Module._load (node:internal/modules/cjs/loader:922:27)
    at Module.require (node:internal/modules/cjs/loader:1143:19)
    at require (node:internal/modules/cjs/helpers:110:18)
    at Object.<anonymous> (D:\Projects\sd-college\server\src\index.ts:4:1)
    at Module._compile (node:internal/modules/cjs/loader:1256:14)
    at Module._compile (D:\Projects\sd-college\server\node_modules\source-map-support\source-map-support.js:568:25)
    at Module.m._compile (C:\Users\KANNUM~1\AppData\Local\Temp\ts-node-dev-hook-17848745239557018.js:69:33)
    at Module._extensions..js (node:internal/modules/cjs/loader:1310:10)
    at require.extensions..jsx.require.extensions..js (C:\Users\KANNUM~1\AppData\Local\Temp\ts-node-dev-hook-17848745239557018.js:114:20)
[ERROR] 00:06:57 Error: Cannot find module '@routes/login'
Require stack:
- D:\Projects\sd-college\server\src\index.ts

index.ts

import express, { Application, Request, Response } from "express";
import bodyParser from "body-parser";
import dotenv from "dotenv";
import { authStudentRoute } from "@routes/login";
dotenv.config();

const app: Application = express();

app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: true }));

app.get("/", (req: Request, res: Response) => {
  res.send("Build Folder Need To Be Served!");
});
app.use(authStudentRoute);

const PORT = process.env.PORT || 8000;

app.listen(PORT, () => {
  console.log(`Server is running on PORT ${PORT}`);
});

I am just try to expect that it should be recognized by the typescript of my custom alias.

Answer 1

In tsconfig.json :

{
  "compilerOptions": {
    "target": "es2018",
    "module": "commonjs",
    "strict": true,
    "esModuleInterop": true,
    "skipLibCheck": true,
    "forceConsistentCasingInFileNames": true,
    "moduleResolution": "node",
    "resolveJsonModule": true,
    "outDir": "dist",
    "baseUrl": ".",
    "paths": {
      "@controllers/*": ["src/controllers/*"],
      "@models/*": ["src/models/*"],
      "@routes/*": ["src/routes/*"],
      "@customTypes/*": ["src/customTypes/*"],
      "@databases/*": ["src/databases/*"],
      "@functions/*": ["src/functions/*"],
      "@middlewares/*": ["src/middlewares/*"]
    }
  },
  "include": ["src"],
  "exclude": ["node_modules"],
  "ts-node": {
    "require": ["tsconfig-paths/register"]
  }
}

In package.json :

  "scripts": {
    "build": "tsc",
    "start": "ts-node index.ts",
    "dev": "ts-node-dev -r tsconfig-paths/register src/index.ts"
  },