[react-native] 경로설정

라이브러리 설치

yarn add --dev babel-plugin-module-resolver

babel.config.js

module.exports = {
  presets: ['module:metro-react-native-babel-preset'],
  plugins: [
    [
      'module-resolver',
      {
        root: ['.'],
        extensions: [
          '.ios.ts',
          '.android.ts',
          '.ts',
          '.ios.tsx',
          '.android.tsx',
          '.tsx',
          '.jsx',
          '.js',
          '.json',
        ],
        alias: {
          '~': './src',
          '@components': './src/components',
          '@styles': './src/styles',
          '@assets': './src/assets',
          '@screens': './src/screens',
          '@navigations': './src/navigations',
        },
      },
    ],
  ],
};

tsconfig.json

{
...
"baseUrl": "./" /* Base directory to resolve non-absolute module names. */,
    "paths": {
      "~/*": ["./*"],
      "@components/*": ["./src/components/*"],
      "@styles/*": ["./src/styles/*"],
      "@assets/*": ["./src/assets/*"],
      "@screens/*": ["./src/screens/*"],
      "@navigations/*": ["./src/navigations/*"]
    } 
...
}

참고

• https://7stocks.tistory.com/128