Skip to content

Path Aliases

· 1 min · configuration

Path alias configuration:

tsconfig.json
{
  "extends": "astro/tsconfigs/strict",
  "compilerOptions": {
    "baseUrl": ".",
    "paths": {
      "~/*": ["./src/*"]
    }
  }
}

Aliases work in files processed by Vite and TypeScript under src/, but not in files like plugins/remark-generate-og-image.ts or unocss.config.ts unless you use tsconfig-paths.

Example:

src/components/MyComponent.tsx
import { formatDate } from '~/utils/helpers';


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


export default MyComponent;