import 와 { }

나는 코캠을 들으면서 하루도 import를 안쓴적이 없다
근데 import를 해올 때 뒤에 어떤 건 {} 가 쓰이고 어떤건 안 쓰인다
이 차이가 뭔지 알아보자

import { useState } from 'react'

import BoardComponent from "../../src/components/units/board/08-board-component/BoardComponent";

이런 차이를 보이는 이유는 보내주는 export의 방식의 차이에서 나오는것이다

index.js 파일

export {a}

export const b = 1

export default  c

이렇게 3 방식으로 export를 해줬다고 하면

main.js 파일

import {a} from './index'

import {b} from './index'

import c from './index'

index.js 파일에서 export를 해줄 때 default 값은 c 라고 의미했기 때문에
그래서 main.js에서

import '어느 이름도 가능' from './index'

이라고 해줘도 '어느 이름도 가능'의 값은 c 가 될 것이다

default 값이 c 이기에 이름은 상관이 없다

하지만 다른 export 들은 default가 아니기 때문에 변수 이름을 그대로 사용해와야 한다
그래서 {} 로 묶어준다

호옥시나 변수명을 바꾸고 싶다면 as 를 이용해

imoprt {a as z} from './index'

이렇게 변수명을 바꿔서 사용이 가능하다!