import, export

import

• 다른 파일에 있는 변수를 현재 파일에서 사용
• 상대경로를 쓴다.
  • 동일한 폴더 안에 있을 때 : "./"
  • 상위 폴더 안에 있을 때 : "../" 

 

// default export는 아무 이름으로 import할 수 있음, 중괄호 없이

// import : 다른 파일에 있는 변수를 현재 파일에서 사용
// 상대경로 . 현재경로

// default 가져올 때 변수 만들어서 가져오기,  as 별칭 사용 가능
import hello, {value1, value2 as content} from "./MyValues.jsx";
// 모든 변수 가져오기
import * as util from "./utils.jsx";

function App(props) {
    return (
        <div>
            <div>value1 : {value1}</div>
            {/*    객체 그대로 쓰면 오류 생김*/}
            <div>value2 : {content.name}</div>
            <div>{util.team}</div>
        </div>
    );
}

 

 

export

• 다른 파일에서 사용 가능하도록 내보내기

// export : 다른 파일에서 사용가능하도록 내보내기
export const value1 = 2024;
export const value2 = {name: "cho", city: "서울"};
export default "hello wolrd";

const v1 = "Korea";
const v2 = 44;
export const v3 = "seoul";
// 여러 변수를 한 번에 export
export { v1, v2 };