目录
1.打包
在package.json有一段代码是命令执行的,代码所示打包命令为build:prod,所以打包命令为npm install build:prod.
"scripts": {
"dev": "vue-cli-service serve --host 0.0.0.0",
"build:prod": "vue-cli-service build",
"build:stage": "vue-cli-service build --mode staging",
"preview": "node build/index.js --preview",
"lint": "eslint --ext .js,.vue src"
},
npm install
#如果卡在timing idealTree:#root Completed in不动执行下边命令,不卡不执行
npm config set registry https://registry.npm.taobao.org
npm config get registry
2.移动文件夹
打包命令执行完成后会出现一个文件夹,默认为dist,在vue.config.js文件中可以通过outputDir设置文件名。将打包的文件夹移动到nginx目录。
outputDir: 'getSal',
3.修改配置文件
server {
listen 8077;#启动端口,与vue.config.js中const port = process.env.port || process.env.npm_config_port || 8077保持一致。
server_name 0.0.0.0;#本机IP
location / {
root getSal;#打包的文件夹名
try_files $uri $uri/ /index.html;
index index.html index.htm;
}
location /prod-api/ {
proxy_set_header Host $http_host;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header REMOTE-HOST $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_pass http://localhost:8088/;#后端地址端口
}
error_page 500 502 503 504 /50x.html;
location = /50x.html {
root html;
}
}