Language/npm,yarn
-
SyntaxError: missing ) after argument listLanguage/npm,yarn 2023. 11. 21. 10:55
어제 작업하다가 맥북 업데이트 하면서 흐름이 끊기면서 나머지 작업은 내일하자고 하고 업무를 종료하였다. 오늘 아침에 일어나서 디자인팀이랑 협의하려고 storybook을 실행하려고 했더니 아무것도 안된다. yarn storybook만 안되는줄 알고 퇴근전에 내가 뭘 건들였나 하면서 git local history 까지 뒤져가면서 한참 헤맷다.. 알고 보니 yarn --version도 안되고 yarn으로 실행하는 명령들은 모두 SyntaxError가 발생하고 있었다. yarn berry 로 설정된 프로젝트 바깥에서 실행하면 문제가 없다. 문제는 yarn berry 관련된거다! yarn berry를 모두 재설치 해볼까 하다가 나중에라도 똑같은 문제가 발생할거 같아서 문제 파악에 들어갔다. 구글링 해도 Synt..
-
yarn berry (yarn V2) VSCode 설정Language/npm,yarn 2023. 11. 17. 11:15
yarn berry를 설치하고 VSCode에서 프로젝트를 열게되면 아래와 같이 react등 import 해오는 모든 module들에서 에러를 접하게 되는데 VSCode에서 Extention을 설치해 주면된다. 1. ZipFS - a zip file system extension 설치 (참조) yarn PnP 모드에서는 패키지를 zip형태로 관리한다. 따라서 사용한 패키지의 원래 코드를 보기위해서는 (go-to-definitions 기능을 사용하기 위해서는) ZipFS와 같이 zip 저장소에 저장된 파일들을 바로 읽을 수 있는 extension을 설치해주어야 한다. 아래 extention을 설치하면 .vscode/extensions.json 파일 생성된다. 2. @yarnpkg/sdks 설치 (참조) ya..
-
yarn berry 도입 (yarn 1 -> yarn 2+)Language/npm,yarn 2023. 11. 16. 14:03
필자는 react + storybook + chromatic + typescript + scss + rollup 등으로 구성되어 있고 라이브러리를 npm까지 올리는 디자인시스템 프로젝트를 yarn berry로 변경해 보았다. yarn 버전 우선순위 순위 1 작업 디렉토리에 .yarnrc.yml 있을경우 ({project}/.yarnrc.yml 2 global yarnrc.yml yarn 버전 변경 (참조) yarn set version berry yarn set version classic yarn berry 버전으로 변경 1.1. 기존 의존성 제거 $ rm -rf node_modules $ rm -rf yarn.lock 2.2. yarn berry 변경 $ yarn set version berry 2...
-
npm/yarn 패키지 배포 및 사용해 보기Language/npm,yarn 2023. 10. 31. 17:34
간단히 body의 background색상이 변경되는 샘플코드를 작성하고 npm packages로 배포하는 방법을 알아보자. 1. 샘플코드 작성 1.1. 리액트 프로젝트 생성 # 리액트 프로젝트 생성 $ npx create-react-app test-npm $ cd test-npm $ cd src/npms 1.2. background 변경하는 use hook 생성 export const useClickBgColor = (e) => { const { target: { value } } = e; document.body.style.background = value; } 1.3. 사용코드 작성 import React from 'react'; import ReactDOM from 'react-dom/client'..