Path Aliases - Sibiswhisper

Path alias configuration:

{
  "extends": "astro/tsconfigs/strict",
  "include": [".astro/types.d.ts", "**/*"],
  "exclude": ["dist", "node_modules", ".local"],
  "types": ["node"],
  "compilerOptions": {
    "paths": {
      "~/*": ["./src/*"]
    }
  }
}

Aliases work in files processed by Astro, Vite, and TypeScript under the normal project pipeline. Config files (e.g., vite.config.ts, unocss.config.ts and plugins.ts) that run before Vite alias resolution may need relative imports instead.

Example:

import { formatDate } from '~/utils/helpers';

function MyComponent() {
  return <div>{formatDate(new Date())}</div>;
}

export default MyComponent;