项目上线常用方案:
把本地的代码打包压缩一份上传到服务器,然后解压到相应地方
从GitHub拉去到相应的地方 配置git webhooks 自动化上线 配置 pm2 自动化上线 使用docker 自动化上线
我们以vnshop项目作为案例
把本地的代码打包压缩一份上传到服务器,然后解压到相应地方
把本地的代码压缩一下,然后上传到服务器
在我们的vue项目里面的client里面执行以下命令
npm run build
这个命令用来把vue项目编译成生产环境需要的文件
生成一个dist 文件夹,把这个文件夹,压缩成zip格式的文件
然后通过xshell 上传到服务器
第一步:安装 lrzsz
apt-get install lrzsz -y
sz:将选定的文件发送到本地机器
rz:运行该命令会弹出一个文件选择窗口,从本地选择文件上传到Linux服务器rz,sz是Linux/Unix同Windows进行ZModem文件传输的命令行工具,第二步:把本地的压缩打包的项目文件通过rz命令上传到服务器
在 /home/wwwroot/ 目录里面执行
cd /home/wwwroot/
执行rz命令,然后跳出一个框,让你选择本地需要上传到服务器的文件。
rz
在服务器哪执行的命令,就上传到哪去
第三步:把上传后的项目,解压复制到网站访问的文件夹里面
添加一个网站,虚拟主机
lnmp vhost add
添加网详细请看
把上传的压缩包解压:
unzip dist.zip
解压完之后,生成一个 dist文件夹
需要把这个文件夹里面的所有文件复制到 vn.itnote.cn文件夹里面去,执行以下命令cp -r dist/* vn.itnote.cn
cp 是拷贝 -r 是深度拷贝,如果里面是文件,需要用 -r /* 代表把dist 文件夹里面的所有文件都拷贝 后面的vn.itnote.cn 文件夹,是要拷贝的目的地
从GitHub拉取项目到相应的地方
第一步:域名绑定到这个主机,并且创建一个虚拟主机
lnmp vhost add创建详细过程请看 https://segmentfault.com/a/1190000011791001
### 第二步:把项目拉取到主机
cd /home/wwwrootgit clone https://github.com/itguide/vnshop10.git vnshopnpm install -g cnpm --registry=https://registry.npm.taobao.orgcd /home/wwwroot/vnshop/clientcnpm inpm run build
第三步:修改Nginx 配置
修改配置
别傻乎乎的复制,后面要修改自己需要配置的文件
vim /usr/local/nginx/conf/vhost/vx.itnote.cn.conf
server { listen 80; #listen [::]:80; server_name vx.itnote.cn ; index index.html index.htm index.php default.html default.htm default.php; root /home/wwwroot/vnshop/client/dist/; include none.conf; #error_page 404 /404.html; # Deny access to PHP files in specific directory #location ~ /(wp-content|uploads|wp-includes|images)/.*\.php$ { deny all; } include enable-php.conf; location ~ .*\.(gif|jpg|jpeg|png|bmp|swf)$ { expires 30d; } location ~ .*\.(js|css)?$ { expires 12h; } location ~ /.well-known { allow all; } location ~ /\. { deny all; } access_log /home/wwwlogs/vx.itnote.cn.log; }
记得重启Nginx 配置哦
重启命令
/etc/init.d/nginx restart
最后在浏览器访问 vx.itnote.cn