node cli 로 @font-face generator 만들기 - 2
저번에 폰트 파일을 바탕으로 font-face CSS
파일을 만들어주는 간단한 node cli
를 개발하는 과정을 포스팅 했었는데 이제는 이를 npm
에 올리고, github actions
을 통해 자동 배포를 하는 방법을 포스팅 해보려고 한다.
생각보다 간단하다.
Github actions workflow 생성
먼저 github actions 에 workflows 파일을 만들어야한다.
해당 레포에 Actions 탭을 눌러보면 New workflow 라고 볼 수 있다.
이를 클릭해서 필자는 npm 에 올릴것이기 때문에 Publish Node.js Package
에 Set up this workflow
를 눌러서 들어간다.
그러면 .yml 파일이 생성되는것을 볼 수 있는데 여기서 필요한 부분만 살리고 나머지는 지워서 다음과 같이 만들었다.
name: Publish to NPM
on:
release:
types: [created]
jobs:
publish-npm:
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v2
- uses: actions/setup-node@v2
with:
node-version: 16
registry-url: https://registry.npmjs.org/
- run: npm install
- run: npm publish
env:
NODE_AUTH_TOKEN: ${{secrets.NPM_TOKEN}}
대략적으로 요약하자면
- release 가 만들어지면 jobs 가 실행된다.
- 코드를 받아오고 node 를 설치한다.
npm install
를 통하여 package 를 설치한다.npm publish
를 통하여 등록한다.
물론 다음과 같은 포맷을 이용하지 않고 바로 '.github/workflows/public-node.yml' 로 작성해도 된다. 하지만 귀찮고 이미 어느정도 만들어 지는걸 잘 가져다 쓰는것도 능력이라 생각한다. ㅎㅎ
그 다음 커밋하면 된다 ㅎㅎ
그런 다음 github action 을 trigger 하기 위해 Releases 를 만들어주면 되는데 그전에 secrets.NPM_TOKEN
를 해결해주어야한다.
보통 npm 계정을 만들고 cli 에서 npm login
-> npm publish
를 해주면 되지만 github actions 에서는 npm 으로 부터 받아온 token 을 설정해주어야지 인증된 사용자라고 인식하고 npm publish
를 해준다.
NPM token 발행
npm token 발급도 역시 아주 간단하다.
npm 계정이 있어야한다 당연하게도
npm 에 로그인 후 프로필을 클릭하면 누가봐도 토큰을 만들어주는Access Tokens
메뉴가 보이는것을 알 수 있다.
들어가서 Generate Token
누르면 다음과 같은 창이 뜨는데 여기서 Automation 을 선택 후 Generate Token
을 누른다. 그러면 토큰이 생성되는데 그것을 복사해서 잘 가지고 있어야한다. 왜냐면 다시 들어가면 안보이기 때문이다.
NPM token 주입
npm token
을 github actions
에서 사용할 수 있도록 주입해주어야한다.
Settings > Secrets
를 들어가서 Repository secrets
에 ${{secrets.NPM_TOKEN}}
와 이름이 같도록 (NPM_TOKEN) 등록해주면 끝이난다.
여기서 Name
은 NPM_TOKEN
, value
는 아까 npm 에서 발급받은 token 값이 된다.
그럼 다음과 같이 잘 등록된 모습이 보인다.
Publish!!
이제 마지막으로 Publish 이다!
repo 에서 Releases 를 통해 하나 release 해주면 이제 github action 이 돌고 npm 에 잘 publish 되는것을 확인 할 수 있다.
단, git tag 를 달아야 Release 할 수 있다. 그리고 다양한 방법으로 github action 을 trigger 할 수 있다.
그리고 npm 에 올라갔기 때문에 이제 다음과 같은 명령어도 사용할 수 있다.
npx gen-font-face
결론
github action 을 통해서 npm에 publish 하는것은 정말 어렵지 않다. 한번 정도 해보면 다음 부터는 수월하게 CI/CD 를 구축 할 수 있다고 생각이 든다. 그리고 요즘에는 정말 많은 레퍼런스들이 많아서 보고 쉽게 따라할 수 가 있기 때문에 누구나 쉽게 오픈소스를 배포하고 관리 할 수 있다고 생각이 든다.
다음에는 어떤 프로젝트를 해볼지 고민도 되고 설레기도 한다. 다음에는 Rust? Svelte?
Author And Source
이 문제에 관하여(node cli 로 @font-face generator 만들기 - 2), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://velog.io/@eomttt/node-cli-로-font-face-generator-만들기-2저자 귀속: 원작자 정보가 원작자 URL에 포함되어 있으며 저작권은 원작자 소유입니다.
우수한 개발자 콘텐츠 발견에 전념 (Collection and Share based on the CC Protocol.)