【TypeScript/JavaScript】importの起点になるパスを設定する

ネコニウム研究所

PCを利用したモノづくりに関連する情報や超個人的なナレッジを掲載するブログ

【TypeScript/JavaScript】importの起点になるパスを設定する

2024-1-22 | ,

TypeScriptやJavaScriptな開発環境でimportの起点になるパスを設定したい!

概要

今回の記事では、TypeScriptやJavaScriptな開発環境でimportの起点になるパスを設定する手順を掲載する。

create-react-appで作ったプロジェクトはベースになるパスが設定されておらず、プロジェクト内のコンポーネントなどをimportする際に相対パスでしか設定できないんだけども、大きめのプロジェクトだとパス設定が煩雑になるのでなんとかする!

仕様書

環境

  • typescript 5.2.2

手順書

TypeScriptの場合はプロジェクトのルートにあるtsconfig.json(JavaScriptの場合はjsconfig.json)のcompilerOptionsの中でbaseUrlに起点となるパスを設定できる。

下記はsrcを起点とする例。

{
    "compilerOptions": {
        ...
        "baseUrl": "./src"
    },
    ...
}

まとめ(感想文)

デフォルトでこの設定でよくなくなくなくない?