Next.js+TypeScriptでパスのaliasを設定する #React

Next.js + TypeScript のプロジェクトで相対パス辛いなとなったので、そのエイリアスの設定方法
import { SomeComponent } from '@/components/SomeComponent みたいなやつです

Next.js での path alias

with absolute imports の example があります
https://github.com/zeit/next.js/tree/master/examples/with-absolute-imports

next.config.js

const path = require('path')

module.exports = {
  webpack(config, options) {
    config.resolve.alias['@'] = path.join(__dirname, 'src')
    return config
  },
}

TypeScript での path alias

tsconfig.json

{
  "compilerOptions": {
    "baseUrl": "./",
    "paths": {
      "@/*": ["src/*"]
    }
  }
}