크기가 작아서 npm을 통해서 간단히 배포하는 방법을 찾기 위해 물었다.
보통 npm을 이용해 프로젝트를 빌드하고 배포하는 경우, package.json 파일에 scripts 항목을 추가하고, 해당 항목에서 빌드 및 배포 명령어를 설정합니다.
아래는 npm run build 명령어로 빌드를 수행하고, npm run deploy 명령어로 빌드된 파일들을 scp 명령어를 이용해 서버에 전송하는 package.json 파일의 예시입니다.
perl{
"name": "my-project",
"version": "1.0.0",
"scripts": {
"build": "react-scripts build",
"deploy": "npm run build && scp -r build/* user@server:/path/to/destination/folder"
},
"dependencies": {
"react": "^17.0.2",
"react-dom": "^17.0.2"
}
}
위 예시에서 react-scripts build는 create-react-app 프로젝트에서 사용되는 빌드 스크립트입니다. 따라서 npm run build 명령어를 실행하면 프로젝트가 빌드되고, build 폴더에 빌드 결과물이 생성됩니다.
npm run deploy 명령어를 실행하면 먼저 npm run build 명령어를 실행하여 프로젝트를 빌드한 다음, scp 명령어를 이용해 build 폴더에 있는 파일들을 서버로 전송합니다. user@server:/path/to/destination/folder 부분은 서버의 계정과 주소, 전송할 폴더 경로를 나타내는 부분입니다. 이 부분은 배포하는 서버의 정보에 맞게 수정해야 합니다.
작업중인 package.json을 변경하고 my-app> npm run deploy ... 이후 scp에 이르러서 암호를 물어본다. The authenticity of host 'a3040.com ( )' can't be established. ECDSA key fingerprint is SHA256:DvY0HUz90oL98QKEyCLZ+iQLV5+56Ytf1Aus8iim9VU. Are you sure you want to continue connecting (yes/no/[fingerprint])? Warning: Permanently added 'a3040.com, ' (ECDSA) to the list of known hosts. fdsdsfdsdsf@a3040.com's password: 계정 암호 입력후 업로드 됨.특이사항 없었음.