node에 NCC를 달아서 배포파일 만들기
오늘의 고민은 node 프로젝트를 배포할때 고민을 해결해보고자 합니다
제가 소속된 팀에서 node프로젝트를 배포하는데 있어 어떤식으로 배포하는지 봤습니다
npm install후 pm2에 배포- docker에 프로젝트를 통으로 옮기고
npm install후 docker 내에 설치한 pm2에 배포
결국 빌드 후 pm2에 배포 하고 있네요..
이것이 크게 문제가 되는 내용은 아닙니다. 서비스도 잘 운영되고 있고, 배포를 하는 CI/CD를 구성하는데 있어 이슈는 1도 없습니다…
하지만 프로젝트를 통으로 들고 다녀야 하고, git의 tag에 의존적으로 버전관리를 하고 있어서 설치를 자동화 하고자 하는데 어려움이 있었습니다
이번 포스팅에서는 NCC를 이용하여 node프로젝트를 배포파일로 만들어보겠습니다
1. node/express 프로젝트 생성하기
저는 webstorm을 이용하여 쉽게 express 프로젝트를 만들었습니다 (물론 cli가 더 편하지만, 저는 툴에 의존적이라서…)
저희는 express 프로젝트의 내용이 중요한건 아니여서 빌드만 잘 되도록 잘 고르시고 프로젝트 생성을 해주세요
npm install 을 진행해주세요
npm install npm run start 를 하여 실행이 잘 되는지 확인해주세요
보통 기본적으로 http://localhost:3000 을 해보면 되겠죠
2. NCC 빌드 진행하기
프로젝트가 정상적으로 세팅이 되었다면 NCC빌드를 해보겠습니다
NCC는 여러 분리된 javascript파일을 1개로 합쳐주는 도구라고 생각하시면 됩니다
- ncc 설치하기
다음 명령어를 입력하여 ncc를 설치합니다
> npm i -g @vercel/ncc
added 1 package, and audited 2 packages in 3s
found 0 vulnerabilities2. ncc 빌드하기
ncc는 기본적으로 다음과 같이 사용할 수 있습니다
$ ncc <cmd> <opts>https://github.com/vercel/ncc 을 통해서 자세한 옵션을 확인해보세요
우리는 bin/www 를 빌드해보겠습니다
프로젝트 루트에서 다음과 같이 터미널 명령어를 날렸습니다
> ncc build ./bin/www -o dist
ncc: Version 0.36.1
ncc: Compiling file index.js into CJS
0kB dist/public/stylesheets/style.css
0kB dist/views/index.ejs
0kB dist/views/error.ejs
1069kB dist/index.js
1069kB [2410ms] - ncc 0.36.1빌드가 완료되었습니다. 프로젝트 루트에 dist폴더가 생긴것을 확인 할 수 있습니다
dist에 있는 index.js 를 실행하고 express가 동작중인지 확인해보세요
> node ./dist/index.jsexpress가 동작이 잘 되는것을 확인할 수 있습니다
3. minify하기
빌드된 index.js파일을 확인해보세요
파일이 이쁘게 펼쳐져있습니다
해당 코드를 minify를 이용하여 줄여보겠습니다
minify가 설치되어 있지 않다면 다음과 같이 설치하세요
> npm i minify -g설치가 되면 프로젝트 루트에서 다음과 같이 터미널 명령을 날려보겠습니다
> minify ./dist/index.js > ./dist/index.min.js소스코드가 줄어들었는지 확인해보겠습니다
> cd dist/
> ls -al
total 3472
drwxr-xr-x 6 nohsunghyun staff 192 Jan 27 20:38 .
drwxr-xr-x 12 nohsunghyun staff 384 Jan 27 20:31 ..
-rwxr-xr-x 1 nohsunghyun staff 1094426 Jan 27 20:31 index.js
-rw-r--r-- 1 nohsunghyun staff 678046 Jan 27 20:39 index.min.js
drwxr-xr-x 3 nohsunghyun staff 96 Jan 27 20:31 public
drwxr-xr-x 4 nohsunghyun staff 128 Jan 27 20:31 views용량이 줄어든 index.min.js 파일을 볼 수 있습니다
실행이 잘 되는지도 확인해야겠죠?
dist폴더에서 다음과 같이 터미널 명령을 날려보겠습니다
> node index.min.js동작이 잘 되는것을 확인하셨나요?
4. PM2에 올려보기
저는 서비스를 PM2에 올려서 서비스 하고있습니다
이렇게 만들어진 파일이 PM2에서도 잘 동작 되는지 확인해야겠죠?
PM2가 설치되어 있지 않다면 다음과 같이 설치하세요
> npm install pm2 -g
npm WARN deprecated uuid@3.4.0: Please upgrade to version 7 or higher. Older versions may use Math.random() in certain circumstances, which is known to be problematic. See https://v8.dev/blog/math-random for details.
added 185 packages, and audited 186 packages in 15s
12 packages are looking for funding
run `npm fund` for details
found 0 vulnerabilities
> pm2 list
-------------
__/\\\\\\\\\\\\\____/\\\\____________/\\\\____/\\\\\\\\\_____
_\/\\\/////////\\\_\/\\\\\\________/\\\\\\__/\\\///////\\\___
_\/\\\_______\/\\\_\/\\\//\\\____/\\\//\\\_\///______\//\\\__
_\/\\\\\\\\\\\\\/__\/\\\\///\\\/\\\/_\/\\\___________/\\\/___
_\/\\\/////////____\/\\\__\///\\\/___\/\\\________/\\\//_____
_\/\\\_____________\/\\\____\///_____\/\\\_____/\\\//________
_\/\\\_____________\/\\\_____________\/\\\___/\\\/___________
_\/\\\_____________\/\\\_____________\/\\\__/\\\\\\\\\\\\\\\_
_\///______________\///______________\///__\///////////////__
Runtime Edition
PM2 is a Production Process Manager for Node.js applications
with a built-in Load Balancer.
Start and Daemonize any application:
$ pm2 start app.js
Load Balance 4 instances of api.js:
$ pm2 start api.js -i 4
Monitor in production:
$ pm2 monitor
Make pm2 auto-boot at server restart:
$ pm2 startup
To go further checkout:
http://pm2.io/
-------------
[PM2] Spawning PM2 daemon with pm2_home=/Users/nohsunghyun/.pm2
[PM2] PM2 Successfully daemonized
┌─────┬───────────┬─────────────┬─────────┬─────────┬──────────┬────────┬──────┬───────────┬──────────┬──────────┬──────────┬──────────┐
│ id │ name │ namespace │ version │ mode │ pid │ uptime │ ↺ │ status │ cpu │ mem │ user │ watching │
└─────┴───────────┴─────────────┴─────────┴─────────┴──────────┴────────┴──────┴───────────┴──────────┴──────────┴──────────┴──────────┘ PM2에 서비스를 올려보겠습니다
dist폴더에서 pm2에 프로젝트를 올려보고 동작을 확인합니다
> pm2 start index.min.js
[PM2] Starting /Users/nohsunghyun/WebstormProjects/expressPrj/dist/index.min.js in fork_mode (1 instance)
[PM2] Done.
┌─────┬──────────────┬─────────────┬─────────┬─────────┬──────────┬────────┬──────┬───────────┬──────────┬──────────┬──────────┬──────────┐
│ id │ name │ namespace │ version │ mode │ pid │ uptime │ ↺ │ status │ cpu │ mem │ user │ watching │
├─────┼──────────────┼─────────────┼─────────┼─────────┼──────────┼────────┼──────┼───────────┼──────────┼──────────┼──────────┼──────────┤
│ 0 │ index.min │ default │ 0.0.0 │ fork │ 5400 │ 0s │ 0 │ online │ 0% │ 15.4mb │ noh… │ disabled │
└─────┴──────────────┴─────────────┴─────────┴─────────┴──────────┴────────┴──────┴───────────┴──────────┴──────────┴──────────┴──────────┘오늘은 node 프로젝트에 NCC를 달아서 배포파일을 만들어봤습니다
빨리 저희 서비스에도 적용해서 가볍게 배포파일을 전달 하면 좋겠네요~
