@max-at/utils
v0.1.2
Published
utils library(MAXST frontend)
Downloads
4
Readme
@max-at/utils
@max-at/utils 라이브러리는 MAXST 프론트엔드 공통 util 함수 모음 라이브러리입니다.
시작하기
max-at 사용 가이드
시작하기
- maxst 이메일 계정으로 github과 NPM에 가입합니다.
- github과 NPM 가입이 완료되면 권한부여를 할 수 있는 개발자에게 이메일을 공유하여 github(maxst-fe), NPM(max-at) 조직 권한을 부여 받습니다.
- 조직 권한을 부여 받은 후, Github max-at 레포지토리를 pull 받습니다.
수정 및 배포 작업 순서
전체적인 라이브러리 수정 작업에 대한 순서입니다.
- max-at 라이브러리 Jira 이슈, 깃헙 이슈 활용 설명a. 현재 max-at 라이브러리가 github 레포로 되어있습니다. 논의한 결과, jira 이슈, 깃헙 이슈를 모두 활용하자는 의견이 나왔습니다.b. jira이슈는 저희가 라이브러리 작업을 하고 있다는 것을 보고차 사용하고 에픽명은 M-PLATFORM 에서 FE 라이브러리입니다. -> 하위 이슈 생성 후 작업 진행하시면 될 것 같습니다.github 이슈를 생성하게 되면 #issueNumber가 생성되어지는데 해당 이슈넘버를 활용하여 feature 브랜치를 따서 작업 진행하시면 됩니다.
- github 브랜치명: feature/library#{issueNumber}-{taskDescription} 입니다
- ex) feature/library#2-add-docusaurus
- 브랜치 생성
- main 브랜치를 기준으로 feature 브랜치를 생성합니다. feature/MP-0000-utils-add-set-table-key
- 로컬에서 수정
- 해당 라이브러리 폴더에서 수정작업을 진행합니다.
- 해당 함수가 사용될 프로젝트에서 모두 테스트를 합니다.
- 수정 및 테스트 완료 후에는 PR을 올립니다.
- PR
- PR 완료 후 배포 준비를 합니다.
- 다른 개발자들은 PR 확인 시, 추가 및 수정된 함수가 자신의 프로젝트에서 사용 될 시, 브랜치를 pull 받아 자신의 프로젝트에 적용해 봅니다.
- PR 완료 후 배포 준비를 합니다.
- 배포
- PR이 완료되면, main branch로 merge를 합니다.
- main branch에 merge하게되며 npm 버전이 업데이트 되었을 경우 자동으로 배포되어 집니다.
수정 방법
아래는 file tree 구조는 max-at 레포지토리의 폴더 구조입니다. max-at에 다양한 라이브러리들이 추가될 예정이며 이 문서에서는 max-at/utils 라이브러리를 기준으로 설명드리겠습니다.
만약 @max-at/utils 라이브러리에 새로운 함수를 추가 할 경우 max-at 레포지토리에서packages/utils/src/utils 에 추가하면 됩니다.
최종적으로 export되는 함수는 utils에 생성, Index.ts에서 exporte되어지며, 이외의 내부적으로 사용하게 될 함수들은 helpers폴더에서 생성하고 수정하시면 됩니다.
├── README.md
└── packages
└── utils // 라이브러리 명(@max-at/utils)
├── README.md
├── package.json
├── rollup.config.js
├── src
│ ├── helpers // export되는 함수는 아니나 내부적으로 사용되는 함수를 생성하시면 됩니다.
│ │ ├── factory // 내부적으로 사용하게 될 팩토리 함수를 생성하시면 됩니다.
│ │ │ └── cookie.ts
│ │ └── unit // 내부적으로 사용하게 될 단일 함수를 생성하시면 됩니다.
│ │ ├── deleteCookiesByToken.ts
│ │ ├── getDateTimeExpiresByToken.ts
│ │ └── setCookiesByTokens.ts
│ ├── index.ts // 최종적으로 export되는 함수들을 export 해주시면 됩니다.
│ └── utils // 최종적으로 export되는 library의 기능을 file 단위로 생성하시면 됩니다.
│ ├── deleteCookiesByToken.ts
│ └── updateCookiesByToken.ts
└── tsconfig.json
└── new library...
build 방법
- 라이브러리 폴더 위치 : max-at/packages/utils
- 작업한 라이브러리 폴더에서 npm run build를 실행하면 dist, esm folder가 추출되어집니다. 그러면 build가 완료된겁니다.
- 아래는 작성일자 기준 build command입니다. 참고하시기 바랍니다.
"build": "rm -rf dist esm && rollup -c && tsc --declaration --emitDeclarationOnly --declarationDir dist" rm -rf dist esm : 기존의 dist esm file을 삭제합니다. rollup -c : rollup library 이용 bundle을 실행합니다. 기본적으로 rollup.config.js 의 file의 설정을 기준으로 실행됩니다. tsc --declaration --emitDeclarationOnly --declarationDir dist : 확인 필요
테스트 방법
. symbol link 이용 방법
library에서 수정하고 npm run build를 실행하면 새로 install이나 추가적으로 link 연결을 실행 하지않아도 project에서 자동으로 수정사항이 바로 반영되어집니다.
라이브러리 폴더 위치 : max-at/packages/utils
패키지 명 : @max-at/utils / 프로젝트 명 : cms-project
# ===== symbol link 이용 테스트 시작 # max-at/packages/utils (패키지명으로 글로벌 심볼링크 생성) sudo npm link # cms-project (cms-project에서 글로벌 심볼링크 연결) npm link @max-at/utils # ===== symbol link 이용 테스트 종료 # cms-project (cms-project에서 글로벌 심볼링크 라이브러리 해제 및 삭제) npm unlink --no-save @max-at/utils # max-at/packages/utils npm uninstall @max-at/utils
수동 publish 방법
- 라이브러리 폴더 위치 : max-at/packages/utils
- 작업한 라이브러리 폴더의 package.json > version 을 0.0.1을 올리고 저장합니다.
- 이미 배포된 버전으로 배포는 불가하므로 새로운 버전으로 배포해야하므로 저장합니다.
- 작업한 라이브러리 폴더에서 npm publish 를 실행하면 배포가 되어집니다.
- 만약 권한 에러가 발상할 경우 터미널에 npm login 명령어를 실행하여 npm이 로그인을 진행합니다.
- 로그인이 완료되면 다시 npm pulish 를 실행합니다.
- https://docs.npmjs.com/cli/v9/commands/npm-login