우분투, nginx를 통해 vue 온라인 프로젝트 출시
하나: nginx 설치
1: 다음 명령을 실행합니다.
sudo apt-get install nginx
2: 설치 후 설치 성공 여부 확인
nginx -v // 查看版本
nginx -t // 查看配置文件是否成功
配置成功会显示：
nginx: the configuration file /xxx/xxx/nginx.conf syntax is ok
nginx: configuration file /xxx/xxx/nginx.conf test is successful
2: nginx에 액세스
1: 성공적인 구성이 표시되면 브라우저에 주소를 입력하여
http://location에 액세스합니다(위치는 서버의 공용 네트워크 IP 주소입니다. 로컬 IP 주소를 모르는 경우 다음을 입력하십시오. curl ifconfig.me command query) 현재
브라우저에서 다음 페이지를 볼 수 있으며 우분투가 성공적으로 설치되었으며 정상적으로 액세스할 수 있음을 나타냅니다.
3: 파일 업로드
1: 먼저 index.html 파일을 생성합니다.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
这是个测试的页面
</body>
</html>
2: 서버에 폴더 생성
mkdir test
3: 방금 만든 폴더에 html 파일을 업로드합니다.
命令行使用scp命令
scp index.html 服务器用户名@服务器ip地址:/test/
4: nginx.conf 파일 편집: nginx는 기본적으로 포트 80에 액세스합니다.
在http模块中配置server模块
server {
listen 80; // 监听的端口
server_name _; // servername，有域名的这里配置域名
root /test;
index index.html;
}
}
5: 편집 후 편집기를 저장하고 종료하고 nginx를 다시 시작합니다.
nginx -s reload
6: 방문할 브라우저로 이동하면 페이지를 볼 수 있습니다.
다른 포트를 구성하려는 경우 구성은 동일하지만 방화벽에서 포트를 해제해야 합니다.그렇지 않으면 오류가 보고됩니다: network_error 7:
하나의 포트에 여러 항목을 구성해야 하는 경우 다음 구성을 사용하십시오.
server {
listen 80;
server_name _;
location / {
alias /test/; // 这里使用alias不要使用root，否则会报错
index index.html;
}
location /xxx {
alias /xxx/xxx/;
index index.html;
}
}
}
// 默认访问的是 /
vue 프로젝트의 릴리스는 위와 동일합니다.
패키지 > 서버 업로드 > 별칭 또는 루트 폴더 구성 > index.html 항목 파일 설정 > nginx 다시 시작 > 페이지 방문