Web/React2 리액트 라이브러리 npm에 배포하기 with rollup 여러 repository에서 동일하게 사용하는 component와 custom hook이 늘어나면서 관리에 많은 공수가 들었다. 코드 하나를 수정하면 다른 프로젝트에도 똑같이 반영하고, 새 프로젝트를 시작할 때마다 똑같은 코드를 옮겨야 했다. 이러한 비효율적인 작업을 개선하기 위해 여러 프로젝트에 걸쳐 사용하는 컴포넌트와 커스텀 훅을 라이브러리로 만들어 npm에 배포하여 사용하기로 했다.프로젝트 세팅패키지 매니저로는 개발자 경험에 이점이 있는 pnpm을 사용했다. pnpm init 먼저 package json에서 npm 배포에 중요한 부분만 설정했다. package.json의 각 항목은 다음과 같은 역할을 한다. name npm에 배포될 라이브러리의 이름 version 라이브러리의 버전 Semantic .. 2024. 1. 31. Recoil을 알아보자 상태 관리 라이브러리의 등장 배경 다음과 같은 상황을 가정해 보자 // src/App.tsx import React from 'react'; import Top from './Top'; function App() { return ; } export default App; App.tsx에서 Top.tsx를 랜더링 하고 // src/Top.tsx // Middle 컴포넌트를 자식으로 가지고 BottomText를 출력해야하는 컴포넌트 import React from 'react'; import Middle from './Middle'; function Top() { return ( Top : {BottomText} ); } export default Top; Top.tsx에서는 Middle.tsx를 랜더링 한.. 2022. 4. 28. 이전 1 다음