[Linux] CentOS Stream 9 환경 구축 7 - npm run dev 오류 해결 / Jenkins 빌드 및 실행

EUN JY·2024년 4월 16일

Linux

목록 보기

9/9

20. npm run dev

ProjYj2024 프로젝트 실행
17-3-npm-run-dev 의 절차 수행 후 다시 npm run dev

[root@localhost ProjYj2024]# npm run dev

> ProjYj2024@0.0.1 dev
> quasar dev


 .d88888b.
d88P" "Y88b
888     888
888     888 888  888  8888b.  .d8888b   8888b.  888d888
888     888 888  888     "88b 88K          "88b 888P"
888 Y8b 888 888  888 .d888888 "Y8888b. .d888888 888
Y88b.Y8b88P Y88b 888 888  888      X88 888  888 888
 "Y888888"   "Y88888 "Y888888  88888P' "Y888888 888
       Y8b


 » Reported at............ 3/29/2024 3:28:11 PM
 » App dir................ /var/lib/containers/storage/volumes/4e56f41adaca53fa1652bb2d5e0aaa4f80905a278588c911343a283eb21be2fb/_data/workspace/ProjYj2024/ProjYj2024
 » App URL................ http://localhost:9000/
                           http://192.168.1.999:9000/
                           http://192.168.1.111:9000/
                           http://10.88.0.1:9000/
 » Dev mode............... spa
 » Pkg quasar............. v2.14.1
 » Pkg @quasar/app-vite... v1.7.0
 » Browser target......... es2019|edge88|firefox78|chrome87|safari13.1

 App • Opening default browser at http://localhost:9000/


You installed esbuild on another platform than the one you're currently using.
This won't work because esbuild is written with native code and needs to
install a platform-specific binary executable.

Specifically the "esbuild-windows-64" package is present but this platform
needs the "esbuild-linux-64" package instead. People often get into this
situation by installing esbuild on Windows or macOS and copying "node_modules"
into a Docker image that runs Linux, or by copying "node_modules" between
Windows and WSL environments.

If you are installing with npm, you can try not copying the "node_modules"
directory when you copy the files over, and running "npm ci" or "npm install"
on the destination platform after the copy. Or you could consider using yarn
instead which has built-in support for installing a package on multiple
platforms simultaneously.

If you are installing with yarn, you can try listing both this platform and the
other platform in your ".yarnrc.yml" file using the "supportedArchitectures"
feature: https://yarnpkg.com/configuration/yarnrc/#supportedArchitectures
Keep in mind that this means multiple copies of esbuild will be present.

Another alternative is to use the "esbuild-wasm" package instead, which works
the same way on all platforms. But it comes with a heavy performance cost and
can sometimes be 10x slower than the "esbuild" package, so you may also not
want to do that.

 App • ⚠️  Failed to open default browser

🔶 2024.03.29 현재 상황

http://192.168.1.111:9000/ 접속 시 연결은 되나, console 창에 다음 내용만 출력되고 아무것도 뜨지 않음
npm run dev 실행 상태를 종료하면 '사이트에 연결할 수 없음' 이 뜨는 것으로 보아 실행은 되었음

/* console 창 */
[vite] connecting...      client.ts:16
[vite] connected.         client.ts:53

🔶 2024.03.29 오류 내용

현재 사용 중인 플랫폼이 아닌 다른 플랫폼에 esbuild를 설치했습니다.
esbuild는 네이티브 코드로 작성되었으며 다음을 수행해야 하기 때문에 이는 작동하지 않습니다.
플랫폼별 바이너리 실행 파일을 설치합니다.

특히 "esbuild-windows-64" 패키지가 있지만 이 플랫폼은 대신 "esbuild-linux-64" 패키지가 필요합니다.
Windows 또는 macOS에 esbuild를 설치하고 "node_modules"를 복사하여 상황을 해결하세요.
Linux를 실행하는 Docker 이미지로 또는 "node_modules"를 복사하여 Windows 및 WSL 환경.

npm으로 설치하는 경우 "node_modules"를 복사하지 않아도 됩니다.
파일을 복사하고 "npm ci" 또는 "npm install"을 실행할 때 디렉터리 복사 후 대상 플랫폼에서. 아니면 원사 사용을 고려할 수도 있습니다.
대신 여러 곳에 패키지를 설치하는 기능이 내장되어 있습니다.

(중략)

20-1. You installed esbuild on another platform 해결

참고 : Error: The package "@esbuild/linux-x64" could not be found, and is needed by esbuild.
node_modules 폴더 삭제 (FileZilla 에서 수동으로 붙여넣기 했었는데, 직접 설치되게 하는 게 맞는 듯)

[root@localhost ProjYj2024]# ls
index.html     node_modules  package-lock.json   public            README.md  test1-src240131am.zip  test1-src240205pm.zip  test1-src240216pm.zip
jsconfig.json  package.json  postcss.config.cjs  quasar.config.js  src        test1-src240201pm.zip  test1-src240213pm.zip
[root@localhost ProjYj2024]# rm -rf node_modules/

npm i 로 다시 install 하여, node_modules 폴더 생성된 것 확인

[root@localhost ProjYj2024]# npm i
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE   package: 'ProjYj2024@0.0.1',
npm WARN EBADENGINE   required: { node: '^18 || ^16 || ^14.19', npm: '>= 6.13.4', yarn: '>= 1.21.1' },
npm WARN EBADENGINE   current: { node: 'v20.9.0', npm: '10.1.0' }
npm WARN EBADENGINE }

added 424 packages, and audited 425 packages in 9s

84 packages are looking for funding
  run `npm fund` for details

3 vulnerabilities (2 moderate, 1 high)

To address all issues, run:
  npm audit fix

Run `npm audit` for details.

[root@localhost ProjYj2024]# ls
index.html     node_modules  package-lock.json   public            README.md  test1-src240131am.zip  test1-src240205pm.zip  test1-src240216pm.zip
jsconfig.json  package.json  postcss.config.cjs  quasar.config.js  src        test1-src240201pm.zip  test1-src240213pm.zip

npm run dev

[root@localhost ProjYj2024]# npm run dev

> ProjYj2024@0.0.1 dev
> quasar dev


 .d88888b.
d88P" "Y88b
888     888
888     888 888  888  8888b.  .d8888b   8888b.  888d888
888     888 888  888     "88b 88K          "88b 888P"
888 Y8b 888 888  888 .d888888 "Y8888b. .d888888 888
Y88b.Y8b88P Y88b 888 888  888      X88 888  888 888
 "Y888888"   "Y88888 "Y888888  88888P' "Y888888 888
       Y8b


 » Reported at............ 4/12/2024 10:14:15 AM
 » App dir................ /var/lib/containers/storage/volumes/4e56f41adaca53fa1652bb2d5e0aaa4f80905a278588c911343a283eb21be2fb/_data/workspace/ProjYj2024/ProjYj2024
 » App URL................ http://localhost:9000/
                           http://192.168.1.999:9000/
                           http://192.168.1.111:9000/
                           http://10.88.0.1:9000/
 » Dev mode............... spa
 » Pkg quasar............. v2.14.1
 » Pkg @quasar/app-vite... v1.7.0
 » Browser target......... es2019|edge88|firefox78|chrome87|safari13.1

 App • Opening default browser at http://localhost:9000/

 App • ⚠️  Failed to open default browser

Failed to open default browser 가 떴으나, http://192.168.1.111:9000/ 로 접속됨

21. Jenkins 빌드 및 실행

정상적으로 ProjYj2024가 실행되므로, npm run dev 가 자동 실행되도록 변경

21-1. log 파일 생성 경로 세팅

log 파일을 저장할 ProjYj2024_log 폴더 생성
경로 : /var/lib/containers/storage/volumes/4e56f41adaca53fa1652bb2d5e0aaa4f80905a278588c911343a283eb21be2fb/_data/logs

[root@localhost logs]# pwd
/var/lib/containers/storage/volumes/4e56f41adaca53fa1652bb2d5e0aaa4f80905a278588c911343a283eb21be2fb/_data/logs
[root@localhost logs]# mkdir ProjYj2024_log
[root@localhost logs]# chmod 777 ProjYj2024_log/
[root@localhost logs]# ls -al
total 8
drwxrwxrwx  2 root  root     6 Apr 12 17:18 ProjYj2024_log
drwxr-xr-x  2 root  root  4096 Apr 12 03:01 tasks

21-2. npmrun.sh 파일 생성

npmrun.sh 파일 생성 및 권한 부여
경로 : /var/lib/containers/storage/volumes/4e56f41adaca53fa1652bb2d5e0aaa4f80905a278588c911343a283eb21be2fb/_data

[root@localhost _data]# pwd
/var/lib/containers/storage/volumes/4e56f41adaca53fa1652bb2d5e0aaa4f80905a278588c911343a283eb21be2fb/_data
[root@localhost _data]# vi npmrun.sh
[root@localhost _data]# chmod 777 npmrun.sh

파일을 열어 아래와 같이 편집

#!/bin/sh
nowDate=`date "+%Y-%m-%d_%H:%M:%S"`
fileName="ProjYj2024_$nowDate.log"

cd ./workspace/ProjYj2024/ProjYj2024
pwd
nohup npm run dev > ../../../logs/ProjYj2024_log/$fileName &

실행 후 log 파일이 정상적으로 생성되는지 확인

[root@localhost _data]# ./npmrun.sh
/var/lib/containers/storage/volumes/4e56f41adaca53fa1652bb2d5e0aaa4f80905a278588c911343a283eb21be2fb/_data/workspace/ProjYj2024/ProjYj2024
[root@localhost _data]# nohup: redirecting stderr to stdout

[root@localhost _data]# cd logs/ProjYj2024_log/
[root@localhost ProjYj2024_log]# ls
ProjYj2024_2024-04-12_13:57:26.log

🔶 백그라운드 실행 중단시키기

ps -ef | grep "quasar dev" : npm run dev 로 인해 실행된 목록 확인 및 중단

[root@localhost ProjYj2024]# ps -ef | grep "quasar dev"
root     1131847 1131836  0 11:49 pts/0    00:00:00 node /var/lib/containers/storage/volumes/4e56f41adaca53fa1652bb2d5e0aaa4f80905a278588c911343a283eb21be2fb/_data/workspace/ProjYj2024/ProjYj2024/node_modules/.bin/quasar dev
root     1131951 1131940  0 11:50 pts/0    00:00:00 node /var/lib/containers/storage/volumes/4e56f41adaca53fa1652bb2d5e0aaa4f80905a278588c911343a283eb21be2fb/_data/workspace/ProjYj2024/ProjYj2024/node_modules/.bin/quasar dev
root     1132841 1124565  0 11:56 pts/0    00:00:00 grep --color=auto quasar dev

[root@localhost ProjYj2024]# kill -9 1131847
[root@localhost ProjYj2024]# kill -9 1131951
[2]-  Exit 137                nohup ./startup.sh  (wd: /var/lib/containers/storage/volumes/4e56f41adaca53fa1652bb2d5e0aaa4f80905a278588c911343a283eb21be2fb/_data/workspace)
(wd now: /var/lib/containers/storage/volumes/4e56f41adaca53fa1652bb2d5e0aaa4f80905a278588c911343a283eb21be2fb/_data/workspace/ProjYj2024/ProjYj2024)

21-3. Jenkins 구성

Jenkins 빌드 후 조치는 아래 두 가지 방법으로 할 수 있음
- Item > Configure > Build Steps > Execute shell
- Item > Configure > 빌드 후 조치 > Post build task
Command : podman exec -it jenkins /bin/bash 에서 보는 경로 기준으로 작성하게 됨

21-4. Execute shell

무조건 실행되는 명령어로, Command 에 작성

echo "ProjYj2024 BUILD > Execute shell START ======================="
echo "ProjYj2024 BUILD > Execute shell END ======================="

지금 빌드 > Console Output 확인

ProjYj2024 BUILD > Execute shell START =======================
ProjYj2024 BUILD > Execute shell END =======================

21-5. Post build task

조건에 따라 실행되는 명령어로, Script 에 작성
git rev-list --no-walk 라는 키워드가 log 에 출력되면(즉, 성공하면) 실행하도록 구성

echo "ProjYj2024 BUILD > Post build task START ======================="
cd /var/jenkins_home
pwd
ps -ef | grep "quasar dev"
./npmrun.sh
ps -ef | grep "quasar dev"
echo "ProjYj2024 BUILD > Post build task END ======================="

21-6. npm: not found

Jenkins 에 NodeJS 플러그인 미설치 시 오류 발생
- ssh 실행 시, npm: not found 문구 출력

jenkins@d7020c058f90:~$ ./npmrun.sh
/var/jenkins_home/workspace/ProjYj2024/ProjYj2024
./npmrun.sh: 7: npm: not found

Jenkins 빌드 시 nohup: failed to run command 'npm': No such file or directory 문구 출력
Plugin 설치 - NodeJS 내용도 수행하였으나, 계속 오류 발생하는 상황
- 자동 실행은 현재 안되고 있음 > 우선은 직접 ./npmrun.sh 을 수행하는 방식으로 진행