# 项目部署
# 项目打包
无论您使用的是Hash路由还是History路由，您都需要根据您要发布的环境来使用以下命令将代码编译并打包。
打包测试环境代码
npm run build:staging
1
打包生产环境代码
npm run build
1
# Hash模式部署
增加以下内容到您的nginx配置文件中。
server {
listen 80;
server_name www.yourdomain.com;
proxy_set_header Host $host;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
location / {
root /xxx/xxx/dist;
index index.html;
}
# 接口代理
location /api {
proxy_pass http://localhost:10010/;
}
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
2
3
4
5
6
7
8
9
10
11
12
13
14
15
其中/xxx/xxx/dist为前端代码包的绝对路径。
# History模式部署
增加以下内容到您的nginx配置文件中。
server {
listen 80;
server_name www.yourdomain.com;
proxy_set_header Host $host;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
location / {
try_files $uri $uri/ /index.html;
root /xxx/xxx/dist;
index index.html;
}
# 接口代理
location ^~ /api/ {
proxy_pass http://localhost:10010/;
}
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
其中/xxx/xxx/dist为前端代码包的绝对路径。