离线内⽹环境vue项⽬build部署nginx
系列⽂章⽬录
第⼀讲
第⼆讲
第三讲
第四讲
⽬录
前⾔
最近接到⼀个项⽬,客户现场是全内⽹环境,只能vpn到客户内⽹,进到客户提供的华为云桌⾯进⾏开发。就是这么个情况,但是没办法,还得做事啊!现在形成⽂字加深印象,也把这段时间的成果记录⼀下,那开始吧!(ps:整个过程是在公司window电脑操作的,现在我在家⾥⽤mac pro写⽂章。截图有些不对,后⾯完善!)
vue项⽬build
npm run build
使⽤该命令,输出dist⽬录,⾥⾯就是打包⽣存的静态⽂件。只要部署到服务器上就可以浏览器访问了。
nginx部署
⼀、安装nginx
先在我们⾃⼰的外⽹机上下载nginx,由于是内⽹环境,下载的安装包是rpm包(ps:nginx安装包在公司电脑⾥,后⾯再补)
⼆、nginx使⽤命令
nginx:启动
nginx -s stop:停⽌
nginx -s reload:重启
三、nginx配置
#新建⼀个服务
server {
listen      8080;
server_name  localhost;
#charset koi8-r;
#access_log  logs/host.access.log  main;
location / {
#root  html;
root    /Users/chenzh/vue/dist;
index  index.html index.htm;
}
}
nginx部署前端项目root:指定项⽬根⽬录dist
如果项⽬有后台接⼝,再配置location转发。
总结
以上就是今天要讲的内容,本⽂仅仅是⾃⼰⼯作中遇到的情况,按⾃⼰的理解进⾏介绍说明,如有不对的地⽅,欢迎指正。