[Node.js] 개발 서버 실행과 빌드

Node.js 패키지를 설치하는 법을 배웠으니 실행하는 법을 정리하고자 한다.

 

아까 parcel-bundler 패키지를 설치하였지만,

프로젝트 내부에서만 설정된 것이기 때문에 터미널에선 직접적으로 parcel 명령어가 뭔지 알 수 없었다.

 

 

📌 해결 방법

package.json 파일을 열어 "scripts" "dev"에 터미널 명령어를 적어준다.

이후 아래의 명령어를 터미널에 치면 오류가 나지 않고 로컬 환경에서 개발용으로 서버가 열리게 된다.

npm run dev

Server running at 뒤에 로컬 호스트 주소가 명시되고 1234라는 포트 번호가 나오는데 

포트 번호는 컴퓨터 내에서 특정한 페이지로 접근할 수 있는 주소이다. 

 

주소를 클릭해보면 서버 실행됨!

 

"scripts" "build"에 build를 추가한 명령어를 적어준다.

아래의 코드를 실행하게 되면 dist 폴더가 생성되면서 사용자들이 보는 용도의 결과물이 출력된다.

npm run build

 

dist 폴더의 index.html 파일을 보면 개발자가 알아보기 어렵게 코드 난독화가 된 것을 볼 수 있다.

build 된 결과(제품)는 브라우저에서 해석되는 용도로, 용량을 축소하고 등의 최적화를 거치는 것이 좋다.

 

번들(bundle)은 우리가 프로젝트 개발에 사용한 여러 모듈(패키지)을 하나로 묶어내는 작업을 말한다.