前言

本文基于

• “react-native”: “^0.70.1”

1.安裝依賴

yarn add babel-plugin-module-resolver --save

2.配置 babel.config.js

plugins: [
  [
    'module-resolver',
    {
      root: ['./src'],
      extensions: ['.ios.js', '.android.js', '.js', '.ts', '.tsx', '.json'],
      alias: {
        '@': ['./src']
      }
    }
  ]
]

3.根目錄新建 tsconfig.json (可選項)

這一步 ts 項目才需要，js 項目直接看下一步

{
  "compilerOptions": {
    "allowJs": true,
    "skipLibCheck": true,
    "esModuleInterop": true,
    "allowSyntheticDefaultImports": true,
    "jsx": "react-jsx",
    "baseUrl": ".",
    "paths": {
      "@/*": ["src/*"]
    },
  },
  "include": ["src"],
  "exclude": ["node_modules"]
}

4.使用別名

新建 src 文件夾，使用 @ 別名引入 src 文件夾下的文件

5.效果圖

yarn android

如果本篇文章對你有幫助的話，很高興能夠幫助上你。

當然，如果你覺得文章有什么讓你覺得不合理、或者有更簡單的實現方法又或者有理解不來的地方，希望你在看到之后能夠在評論里指出來，我會在看到之后盡快的回復你。