Jul. 10, 2021, 11:51 am.
문제점
npm에 배포하는 라이브러리를 만들 때 "어떻게하면 빠르게 테스트해보고 고칠 수 있을까" 하는 고민에 여러 방법을 사용해봤습니다.
npm publish --tag next
나 create-react-app을 사용해 데모 웹페이지를 만드는 방식이죠.
그러다 주로 사용하고 있는 next.js를 사용해서 할 수 있을까 고민하게 됐고, 몇 번의 시행착오 끝에 그런 구조를 같게 되었습니다.
Workspaces
npm/yarn에서 제공하는 Workspace를 사용하면 monorepo + multi package가 가능합니다.
라이브러리 코드를 들고 있는 폴더의 package.json에 name을 workspace-${library_name}
로 작성하면 (저의 경우 workspace-athena) 예저 코드를 들고 있는 폴더에서 import * from 'workspace-athena'
가 가능해집니다.
마치 실제 라이브러리를 사용하는 것처럼 import 해서 쓸 수 있기 때문에 라이브러리 코드 내에서 실수로 export 되지 않은 코드들을 발견할 수도 있습니다.
next.config.js
require('next-transpile-modules')(['workspace-athena'])