기존 Next 프로젝트 Yarn berry 적용기!

이력서에 올리던 포트폴리오 사이트에 내용들을 업데이트하는김에..!
electron 프로젝트에서 사용해보고 싶었지만 호환이 안되서 아쉬웠던 yarn berry를 적용해보기로 했다!

Yarn berry 복습 -> 더 자세히 보고싶으면 여기

• npm, yarn과 같은 패키지 매니저
• yarn의 2.x 버전부터 yarn berry라고 명명함 (확연한 변화가 있기 때문)

  🐣 node_module -> .pnp.cjs파일에 의존성을 찾을 수 있는 정보가 기록

yarn berry를 적용해보자

• 참고로 나는 노트북을 바꾸고 깃에 있던 프로젝트를 clone 받은 상태에서 시작했기 때문에 node_modules 폴더가 없었기 때문에 삭제하는 과정을 거치지 않았다!

1. git bash(terminal) 창에서 프로젝트 디렉토리로 이동해준다.

• yarn berry는 yarn처럼 글로벌로 설치하는게 아니라 프로젝트 단위로 설치해주는게 좋다
  - 프로젝트 간의 의존성 충돌을 초래할 수 있기 때문..!

2. yarn berry를 설치한다

yarn set version berry

위 명령어로 yarn berry를 설치해주면 된다.
설치가 완료되면 package.json 파일에 아래와 같이 packageManager가 yarn@4.3.1로 설정되어 있는걸 확인하면 된다.

3. .yml파일 수정하기

nodeLinker: pnp

yarn berry에서도 마찬가지로 node_modules를 사용할 수 있다.
하지만 난 plug&play를 쓰기 위해서 yarn berry를 쓰는거잖아?
그렇기 때문에 nodeLinker를 pnp로 설정해준다!
여기서 기존에 node_module가 있는 프로젝트는 node_module 폴더를 삭제해주면 될듯? (아래 명령어 쓰면 된다 :)

rm -rf node_modules

4. 종속성 설치하기

yarn install

node_modules를 지웠으니까 다시 설치해줘야지?
yarn install로 다시 설치해준다.

5. 끝! 인줄 알았지 나도..

yarn dev

설정은 끝났다! 실행시켜서 확인해주면 된다...는줄알았지만

모듈을 찾을 수 없다는 에러가 나온다;;;
뒤적거리면서 종속성 재설치도 해보고 캐시를 지우래서 지워봤지만 원인은 쓸데없는 곳에 있다

바로 여기 ..
여기.. 경로에 절대 한글이 있어선 안돼 ......
그래서 경로에 영어가 없는곳을 찾아서 옮기고 실행해봤다..

너뮤 잘됨 ..

Bonus : 경로 내 '바탕화면' 영어로 바꾸기

그치만 나는 바탕화면에.. 놓고싶은데...

내PC로 들어가서 왼쪽 바탕화면 마우스 오른쪽 -> 속성 -> 위치 -> 경로를 수정하고 재부팅해줬다.

그럼 이렇게 바뀌는데 .. ?
경로에 영어 없으니까 이제 된거아닌가 .. ? (아님)

그래서 새로 클론받아서 1번으로 돌아갔다 ㅎ;;

하지만 성공했죠 ? 글엄 안뇽