🔥码云GVP开源项目 12k star Uniapp+ElementUI 功能强大 支持多语言、二开方便! 广告
### 一,获取前端 前端所在位置 ![](https://img.kancloud.cn/55/dc/55dc07594d337d04012329b1e8034da2_579x870.png) 用vscode打开前端,yarn初始化 ![](https://img.kancloud.cn/0e/5c/0e5c880fa15e976d1642d474ffde4e0f_1849x999.png) 完成后,修改index.js.修改请求IP为服务器IP ![](https://img.kancloud.cn/8b/72/8b7234e4821594e8fb62bb89d854bb85_1741x586.png) ```yarn serve```启动vue,点击链接进入前端 ```admin/Abcd1234``` ![](https://img.kancloud.cn/f6/b6/f6b6f8c4fde26d6b1f5a1d6c319eb286_1914x930.png) ### 二,打包部署 ```yarn build```打包vue前端项目,打包完可以看到一个 dist文件夹 ![](https://img.kancloud.cn/c9/fc/c9fcb38d7d48e4953df710613bb47b62_488x580.png) 在服务器创建两个文件夹 ![](https://img.kancloud.cn/20/3a/203af68f51fc8b25dbef366353b78ad5_628x388.png) 在conf文件夹内放入 nginx,conf文件 生成新的docker镜像,启动nginx服务 ~~~ sudo docker run --name nginx-hospital --restart always -d -p 8081:8080 -v /mnt/nginx/conf/nginx.conf:/etc/nginx/nginx.conf -v /mnt/nginx/html:/usr/share/nginx/html nginx ~~~ 将打包的前端放入服务器 ![](https://img.kancloud.cn/ee/46/ee4684ec362e8090ca9ce6ccb859436d_1864x632.png) ```docker restart nginx-hospital ```重启服务 http://121.36.64.88:8081 登陆 admin/Abcd1234 ![](https://img.kancloud.cn/e6/74/e674a33b48fcd7669e77be5230c502ec_1827x851.png) 后续不需要重启nginx,只需要覆盖前端就可以