[React, React Native] index.js

Inhye Choi·2023년 3월 3일
0
post-thumbnail

About

index.js파일을 통해 상위 폴더를 모듈로 import해서 사용할 수 있습니다.
디렉토리에 Package.json 파일이 없으면 index.js 파일 로드를 시도하는 이 방식은 Node.js에서 차용되었습니다. 관련 정보는 여기에서 확인해볼 수 있습니다.

Examples

├── components
    ├── App
    │   ├── App.jsx
    │   ├── app.css
    │   ├── app_test.jsx
    │   └── index.js
    ├── Home
    │   ├── Home.jsx
    │   ├── home.css
    │   ├── home_test.jsx
    │   └── index.js

🤔 index.js 파일이 있을 때 import 하는 법

import Home from '../Home';

🤔 index.js 파일이 없을 때 import 하는 법

import Home from '../Home/Home';

🤔 이렇게도 할 수 있어요.

// Buttons/index.js
import IconButton from './IconButton' // ./IconButton.js
import TextButton from './TextButton' // ./TextButton.js

export{
  IconButton,
  TextButton
}
// SomeOtherFile.js
import * as CommonButtons from './Buttons'

// 접근하는 방법
CommonButtons.IconButton
CommonButtons.TextButton

🔗 참고 링크

https://nodejs.org/dist/latest-v7.x/docs/api/modules.html#modules_folders_as_modules
https://stackoverflow.com/questions/44092341/how-do-index-js-files-work-in-react-component-directories
https://nodejs.org/dist/latest-v7.x/docs/api/modules.html#modules_folders_as_modules

0개의 댓글