Nginx 웹서버를 통해 Vue를 배포하는 방법에 대해 간단하게 소개하려고 합니다.
EC2 인스턴스발급은 생략하겠습니다. 오로지 우분투 내에서 vue와 nginx 세팅에 대해서만 언급하겠습니다.
// vue.config.js
module.exports = {
configureWebpack: {
},
devServer: {
host: "0.0.0.0",
hot: true,
disableHostCheck: true
},
};
$ sudo apt-get install nginx
$ nginx -v #잘 설치되었는 지 버전 확인
$ sudo vim /etc/nginx/sites-enabled/default #nginx 세팅하기
$cd frontend
$npm run build
server{
listen 80; # 80번포트로 실행하겠습니당
listen [::]:80;
server_name [도메인 주소]
root /home/ubuntu/.../frontend/dist; #[프론트엔드 build해서 만들어진 dist폴더]
index index.html;
# 기본주소는 프론트엔드 index.html로 이동한다라고 선언
location / {
try_files $uri $uri/ index.html
}