React Native 使用 alias,不用寫很多相對路徑。

在React Native 版本0.61.5 ,使用 npx react-native init 建立的專案,自動會幫你安裝 metro-react-native-babel-preset ,並且產生 babel.config.js 這隻檔案
所以只需額外安裝 babel-plugin-module-resolver

$ yarn add babel-plugin-module-resolver -D

安裝好之後,新增以下程式碼:

module.exports = {
    presets: ['module:metro-react-native-babel-preset'],
    plugins: [
      [
        'module-resolver',
        {
           root: ['./'],
           extensions: ['.js', '.ios.js', '.android.js', 'js'],
           alias: {
               '@c': './src/components',
               '@p': './src/pages',
           },
         },
       ],
    ],
};

接著在頁面中引入:

import Home from '@p/home';

| 軟體開發 | 網站建置 | 網頁系統 | 資料庫網站 |

| 客製化網站 (報名系統、投票系統、掛號系統...) |

| 前後端技術合作 |

歡迎與我們聯繫:jessica@penueling.com

加入Line立即聊聊:@539mjyid

0
0 回復

發表評論

Want to join the discussion?
Feel free to contribute!

發佈留言

發佈留言必須填寫的電子郵件地址不會公開。