linux 修改vue文件,linux 下部署 vue项目自动化部署，一键部署

心已赠人 2023-01-19 10:50 237阅读 0赞

说，将大象放到冰箱需要三步

那么把项目放到服务器上，需要几步呢 ？？？

下面分享两种方式 方式 方式 方式 方式 方式 方式 方式 方式 方式 方式

1、项目直接在本地打包后，复制到服务器对应的文件夹即可

vue的项目，在本地打包以后，会生成一个dist文件夹，该文件夹下面的所有资源，就是你需要放到服务器上的文件。

本地打包后的文件夹目录：

![740c49ff3060cb59fbf8313602244275.png][]

有ftp工具

如果有ftp工具，直接使用ftp工具将本地文件复制过去，复制到服务器对应的文件夹下

无ftp工具

需要使用服务器上传文件命令，如rz sz 等

2、在服务器上执行命令，自动完成部署过程

经过一段时间的 方式1 之后，烦了，你需要一个一键部署到服务的过程

这个时候，你需要使用 脚本，

登陆服务器后，执行一个脚本，就自动完成这个过程

先分析脚本的过程

1、拉去最新的代码 (需要使用 git )

2、安装依赖(需要 npm )

3、构建打包 (需要 node)

4、删除服务器文件夹下的就项目文件

5、新打包好的文件复制过去

6、完成

上代码

build.sh

\# 当前路径 /deploy/data/nginx

\# 存放脚本路径 /deploy/data/nginx/shs

\# 线上文件 /deploy/data/nginx/pages/

\# 代码路径 /deploy/data/nginx/codes/

\# 删除项目目录下得代码

rm -rf ./codes/project-name/\*

\#切换到代码目录

cd ./codes

\# clone 新的代码

git clone http://www.nidexiangmu.com/project-name.git

\# 进入目录

cd project-name

\# 切换分支到你需要的分支

git checkout branchName

\# 安装依赖

npm install

\# 打包

npm run build

\# 删除 ngnix 指向的文件夹下得文件

rm -rf /deploy/data/nginx/page/project-name/\*

\# 将打包好的文件复制过去

mv /deploy/data/nginx/codes/project-name/dist/\* /deploy/data/nginx/page/project-name

等待脚本执行完毕，就部署完成，还可以再脚本中添加一些logo，提示用户构建的过程和结果

[740c49ff3060cb59fbf8313602244275.png]: /images/20221021/2d8a684f6ced47c79468dff5f0bcf10f.png

发表评论取消回复

表情：

评论列表（有 0 条评论，237人围观）

还没有评论，来说两句吧...

相关阅读

相关 linux部署jdk_linux部署项目

1.安装JDK:sudoapt-getinstallsun-java5-jdk2.配置环境变量:在/etc/profile末尾添加如下代码:\JavaEnvironmentex

小灰灰/ 2024年04月03日 13:47/ 0 赞/ 100 阅读

相关 Linux部署前端Vue项目

Linux部署前端Vue项目 1 部署到tomcat上 1.1 部署Vue项目 1. 打包项目在命令行终端，输入命令，打包项目： npm ru

ゝ一纸荒年。/ 2024年04月01日 17:54/ 0 赞/ 116 阅读

相关 vue使用docker+node+nginx+linux自动化部署

假定你已经有一个vue项目了，并且已经用github进行管理了，假定你还有一台免费的linux服务器，想用自动化部署的方式解放双手，假定你已经了解dockerhub使用

叁歲伎倆/ 2023年10月04日 20:20/ 0 赞/ 34 阅读

相关 springcloud+vue+nginx+linux项目部署

一、项目打包右边栏Maven Projects ——> package 进行项目打包（可以把闪电标志点掉，这样会过滤掉test项） ![watermark_type_d3

比眉伴天荒/ 2023年09月29日 12:03/ 0 赞/ 15 阅读

相关 Linux安装nginx及部署vue项目

目录一、下载nginx 二、用xshell连接服务器 1、创建nginx目录：\`mkdir nginx\` 2、\`cd ngi

一时失言乱红尘/ 2023年02月21日 06:53/ 0 赞/ 99 阅读

相关一键自动化部署项目

[coding持续集成流程搭建（自动部署）][coding] [Docker+K8S+Jenkins项目实战视频教程（经典）][Docker_K8S_Jenkins]

青旅半醒/ 2023年02月21日 06:21/ 0 赞/ 34 阅读

相关 linux 修改vue文件,linux 下部署 vue项目自动化部署，一键部署

说，将大象放到冰箱需要三步那么把项目放到服务器上，需要几步呢？？？下面分享两种方式方式方式方式方式方式方式方式方式方式方式 1、项目直接在本地打

心已赠人/ 2023年01月19日 10:50/ 0 赞/ 238 阅读

相关 jenkins自动化部署vue

jenkins自动化部署vue 一、nodejs配置首先加入nodejs插件 ![这里写图片描述][70]–>![这里写图片描述][70 1]–>

雨点打透心脏的1/2处/ 2022年11月02日 11:51/ 0 赞/ 382 阅读

相关部署Vue项目到Linux服务器

[步骤1：CentOS7.5 安装docker][1_CentOS7.5 _docker] [步骤2：CentOS7.5基于docker安装nginx][2_CentOS7.

柔情只为你懂/ 2022年10月15日 04:48/ 0 赞/ 300 阅读

相关 jenkins自动化部署vue项目

jenkins自动化部署vue项目一、搭建node环境 1. 下载linux版本的nodejs，并上传到linux下

朱雀/ 2021年09月28日 13:52/ 0 赞/ 758 阅读