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

心已赠人 2023-01-19 10:50 179阅读 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 条评论，179人围观）

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

相关阅读

相关 linux部署jdk_linux部署项目

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

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

相关 Linux部署前端Vue项目

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

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

相关 Linux CentOS + Nodejs + Koa部署vue项目

注：服务器为CentOS 7.3.1611，使用Xshell6 + Xftp6工具完成服务器远程操作一、安装Node环境通过Xshell连接服务器成功之后就可以开始

你的名字/ 2023年06月06日 03:46/ 0 赞/ 13 阅读

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

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

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

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

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

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

相关 jenkins自动化部署vue

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

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

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

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

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

相关 vue项目部署

1、更改项目下config文件夹index.js文件(标红处两个位置) build: { env: require('./prod.env'),

拼搏现实的明天。/ 2022年06月13日 09:07/ 0 赞/ 220 阅读

相关 jenkins自动化部署vue项目

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

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

相关 vue项目部署

开发完的vue项目，需要部署到Nginx/Tomcat服务器上运行，作为一个前端小白，刚接触vue不久，研究了一番，于是写下这篇文章，记录下来便于今后部署。 1.route

浅浅的花香味﹌/ 2021年09月02日 04:35/ 0 赞/ 423 阅读