Astro

Astro の import statement で alias を使ってパス指定を簡単にする

October 23, 2025

Astro では、alias を使って import statements でのパス指定を簡単にすることができる。

この機能を使うには tsconfig.jsoncompilerOptions.paths を次のようにする。

tsconfig.json
{
  "extends": "astro/tsconfigs/strict",
  "include": [".astro/types.d.ts", "**/*"],
  "exclude": ["dist"],
  "compilerOptions": {
    "paths": {
      "@components/*": ["./src/components/*"]
    }
  }
}

これにより、次のように import statement を書くことができる。

import Button from '@components/Button.astro'

Back to Note