[React] importする際に絶対パスで書きたい

Reactでコンポーネントをimportする時などに、いちいち相対パスで書くのは面倒。そんな時は、絶対パスで書けるように設定しておきましょう。

//こうじゃなくて。。。
import Button from '../../components/atom/Button'

//こう書きたい
import Button from 'components/atom/Button'

設定

簡単です。
Create React Appのドキュメントに書いてあります。

プロジェクトのルートに、 jsconfig.json 又は、 tsconfig.jsonを作成して以下を追記するのみです。

jsconfig.json又はtsconfig.json

{
  "compilerOptions": {
    "baseUrl": "src"
  },
  "include": ["src"]
}

これでいちいち相対パスで書かなくて済みます。

Create React App [Absolute Imports]