700字范文,内容丰富有趣,生活中的好帮手!
700字范文 > Vue项目打包部署到服务器(Linux)

Vue项目打包部署到服务器(Linux)

时间:2019-07-16 23:12:41

相关推荐

Vue项目打包部署到服务器(Linux)

一、打包(build)

npm run build / yarn build

打包完成后项目路径会多出一个dist文件夹

到这里本地的打包完成了

然后到服务器

二、服务器配置(nginx)

**注:如果已经有nginx环境了的话直接到第6小步**

1、查看gcc版本 gcc -v

没有的话安装

yum -y install gcc

2、pcre、pcre-devel安装

pcre是一个perl库,包括perl兼容的正则表达式库,nginx的http模块使用pcre来解析正则表达式,所以需要安装pcre库。

yum install -y pcre pcre-devel

3、zlib安装zlib库提供了很多种压缩和解压缩方式nginx使用zlib对http包的内容进行gzip,所以需要安装

yum install -y zlib zlib-devel

4、安装opensslopenssl是web安全通信的基石,如果没有openssl,我们的信息可以说都是在裸奔。。。。。。

安装命令:

yum install -y openssl openssl-devel

5、安装nginx

去到一个文件夹cd /usr/local/web

a、下载nginxwget /download/nginx-1.9.9.tar.gz

b、解压压缩包tar -zxvf nginx-1.9.9.tar.gz

c、切换到cd /usr/local/web/nginx-1.9.9/下面执行三个命令:

1. ./configure

2. make

3. make install

Nginx安装成功

如果已经安装了的可以直接从第6步(这一步)开始

6、切换到nginx安装目录(默认是/usr/local/nginx)

可以执行where nginx查看

修改nginx文件夹里的nginx.conf修改默认配置,

默认配置已经够用了基本只需要修改一下端口和路径,

默认端口是80,一般都是已经被占用了的,改成其它自己需要的

然后路径是刚刚打包的dist文件的路径

最基础的配置(如果已经有其他项目在nginx里了也可以直接在http{里面再加上这一段})

server {listen 8080; server_name project1; location / {root edu/dist; #dist路径 index index.html index.htm; } }

7、启动nginx服务切换目录到/usr/local/nginx/sbin下面

执行./nginx启动

其它nginx命令

./nginx -s stop #停止./nginx -s quit #比较安全的退出./nginx -s reload #刷新重启

8、查看nginx服务是否启动成功

ps -ef | grep nginx

然后开放端口(开放端口的操作这里就略啦——云服务器的去对应平台设置安全组里添加)

不出意外的话执行你的ip或者域名:10.0.xx.xx:8080就可以访问到你的项目了

接下来则可以开始进入CICD的进阶方式;实现持续部署

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。