typescript 配置 alias

1 安裝依賴

npm install --save-dev babel-plugin-module-resolver
# yarn add babel-plugin-module-resolver --dev

根目錄新增.babelrc文件
參考以下內容按您項目中的需要去修改

{
  "presets": ["next/babel"],
  "plugins": [
    [
      "module-resolver",
      {
        "alias": {
          "@/actions": "./actions",
          "@/components": "./components",
          "@/constants": "./constants",
          "@/pages": "./pages",
          "@/public": "./public",
          "@/reducers": "./reducers",
          "@/utils": "./utils"
        }
      }
    ]
  ]
}

修改tsconfig.json文件

{
  "compilerOptions": {
    "baseUrl": "./",
    "paths": {
      "@components/*": ["./components/*"],
      "@pages/*": ["./pages/*"],
      "@public/*": ["./public/*"]
    }
  }
}

注意"baseUrl": "./",不能省去，否則ts報Option 'paths' cannot be used without specifying '--baseUrl' option.錯誤

next.js中配置alias也可以參考如上步驟