前端Vue项目的自动打包、上传与部署

news/2024/10/5 13:54:10 标签: vue.js, javascript, 自动打包部署

文章目录

  • 前言
  • 思路与流程
  • 脚本实现
    • 1. 打包前端项目
    • 2. 上传前端项目
    • 4. 传递密码
    • 5. 代码优化
  • 完整脚本
  • 结语

前言

在实际项目开发中,并不是所有项目都会配置 CI/CD 流程,特别是在中小型团队或者公司内部测试环境中,很多时候我们仍然需要手动打包、上传和部署项目。这个过程虽然简单,但往往是重复性强且浪费时间还容易出错,尤其是当项目规模较大时,整个流程会变得非常耗时和繁琐。

为了解决这些问题,我们可以编写一个自动化脚本,将项目的打包、上传及部署等一系列步骤自动化,这样可以减少重复性工作,节省时间,提高效率。接下来,我将详细介绍如何通过 Shell 脚本来实现这一流程的自动化。

思路与流程

手动部署一个前端项目的典型步骤包括:

  1. 执行 npm run build 打包前端项目。
  2. 将打好的项目打成压缩包(如 .tar 包)。
  3. 使用 scp 命令将压缩包上传到服务器。
  4. 登录到服务器,解压并替换掉当前的前端项目包。
  5. 执行一些后续清理操作,必要时重启服务。
    这些步骤虽然不复杂,但手动执行时耗时且容易出错,尤其是等待项目打包和文件上传时,可能会耗费大量时间。

通过编写一个自动化脚本࿰


http://www.niftyadmin.cn/n/5690983.html

相关文章

(Django)初步使用

前言 Django 是一个功能强大、架构良好、安全可靠的 Python Web 框架,适用于各种规模的项目开发。它的高效开发、数据库支持、安全性、良好的架构设计以及活跃的社区和丰富的文档,使得它成为众多开发者的首选框架。 目录 安装 应用场景 良好的架构设计…

职场祛魅:判断2B企业和外包公司?

长假期间有初入职场的小伙伴跟猫哥聊天,说起来外包公司,并认为:外包公司也为企业提供服务,2B从名字上判断就是为企业服务的。 一、怎么判断一个企业是2B而不是外包? 以下是猫哥从业N年的一点粗浅认识: 要…

C语言复习概要(二)

本文目录 C语言中的数组与函数详解1. 引言2. 数组2.1. 什么是数组?语法:示例: 2.2. 数组的初始化示例 1:在声明时初始化示例 2:部分初始化示例 3:运行时赋值 2.3. 数组的访问与修改示例: 2.4. 多…

web网页项目--用户登录,注册页面代码

index.html <!DOCTYPE html> <html lang"zxx"><head><title>xxx注册</title><!-- Meta tags --><meta charset"UTF-8"><meta name"viewport" content"widthdevice-width, initial-scale1.0&q…

yjs11——pandas运算

1.算术运算 加法&#xff1a; data.&#xff08;列名.&#xff09;add(k) data&#xff08;.列&#xff09; k 减法&#xff1a; data["W"].sub(k)注意&#xff1a; data["列名"]的效果data.列名 2.逻辑运算 2.1直接比较型满足条件赋值 2.2函数型&#x…

[SQL] 数据定义语言

一 数据库操作 查询所有数据库&#xff1a; SHOW DATABASES; 使用某个数据库 USE 数据库名; 查询当前数据库: SELECT DATABASE(); 创建数据库 对于[]内的可以省略&#xff0c;因为数据库有默认的对应的执行操作。实例:create database if not exists vretc default cha…

[CSP-J 2022] 逻辑表达式

题目来源&#xff1a;洛谷题库 [CSP-J 2022] 逻辑表达式 题目描述 逻辑表达式是计算机科学中的重要概念和工具&#xff0c;包含逻辑值、逻辑运算、逻辑运算优先级等内容。 在一个逻辑表达式中&#xff0c;元素的值只有两种可能&#xff1a; 0 0 0&#xff08;表示假&#x…

C#中虚函数和抽象函数的概念

1&#xff09;虚函数 virtual virtual用于在基类中修饰方法&#xff0c;允许在派生类中使用override关键字重写方法 默认情况下&#xff0c;方法是非虚拟的。 不能替代非虚方法。v irtual 修饰符不能与 static、abstract、private 或 override 修饰符一起使用。 virtual 方法…