当前位置: 首页 > article >正文

vitepress一键push和发布到github部署网站脚本

文章目录

  • 前言
  • 一、viteress基本结构
  • 二、脚本
    • 1、push
    • 2、dev
  • 总结


前言

没啥可说的 脚本是bat文件,直接双击运行


提示:以下是本篇文章正文内容,下面案例可供参考

一、viteress基本结构

创建完你的文档,目录如下

+---bin
+---docs
|   +---.vitepress
|   |   +---cache
|   |   +---components
|   |   +---relaConf
|   |   \---theme
|   +---column
|   |   +---javascript
|   |   |   \---base
|   |   |       +---images
|   |   |       \---index.assets
|   |   +---questions
|   |   +---views
|   |   |   +---project
|   |   |   |   \---images
|   |   |   \---vite
|   |   |       +---01-初始化项目.assets
|   |   |       \---images
|   \---images

在这里插入图片描述

二、脚本

用法
你先在github创建一个仓库,名叫vitepress-notes
必须是 Public 开放的
然后用小乌龟或者直接cmd语句
git remote绑定仓库,确保自己能推送这个默认主分支
我的github主分支叫main,如果是master,则修改

1、push

放在文件夹bin里面

具体目录结构看上面图片

代码如下(示例):

@chcp 65001 >nul
@echo off
echo.
echo [信息] 推送代码到 GitHub main 分支,并构建并推送静态文件到 gh-pages 分支。
echo.

REM 切换到脚本所在盘符
%~d0

REM 切换到脚本所在目录
cd %~dp0

REM 切换到项目根目录
cd ..

REM 推送代码到 main 分支
git add .

set datetime=%date%_%time:~0,2%-%time:~3,2%-%time:~6,2%
git commit -m "Auto Commit: %datetime%"

git push origin main

echo.
echo [信息] 构建项目并推送到 GitHub gh-pages 分支。
echo.

REM 生成静态文件
npm run build

REM 进入生成的文件夹
cd docs\.vitepress\dist

REM 初始化 .git 仓库,拉取远程 gh-pages 分支
if not exist ".git" (
    git init
    git remote add origin git@github.com:gbm2001/vitepress-notes.git
)

REM 切换到 gh-pages 分支(创建本地 gh-pages 分支,如果不存在)
git checkout -B gh-pages

REM 拉取远程 gh-pages 分支的最新内容以避免冲突
git pull origin gh-pages

REM 添加并提交构建的文件
git add -A
git commit -m "deploy: %datetime%"

REM 推送到远程 gh-pages 分支
git push -f origin gh-pages

REM 返回到项目根目录
cd %~dp0

pause

2、dev

@echo off
echo.
echo [信息] 使用 Vue CLI 命令运行 Web 工程。
echo.

%~d0
cd %~dp0

cd ..
npm run dev

pause

总结

正确执行的话,应该cmd弹窗全程无任何error报红报错


main 主分支如下
在这里插入图片描述

并且 githubgh-pages 如下
在这里插入图片描述
写一个bat同时推送到主分支,打包后的dist推送到指定分支,很简单,gpt一下就好了。
以前没这个思路,我把viteress-notice拆分成2个仓库
源码push在gitee,然后把打包出来的dist传到github,每次要两次push,挺麻烦的

成功后看效果
在这里插入图片描述
在这里插入图片描述
下期搞点vitepress的扩展,例如左下角的总访问量


http://www.kler.cn/news/366173.html

相关文章:

  • 【Java网络编程】从套接字(Socket)概念到UDP与TCP套接字编程
  • 【Flutter】状态管理:Provider状态管理
  • 什么是DSSA?
  • 使用AutoDL训练YOLO等计算机视觉网络模型(AutoDL+Xftp+VS Code),附详细操作步骤
  • 信息安全工程师(67)网络流量清洗技术与应用
  • 纳斯达克大屏投放:为什么越来越多的企业要投放纳斯达克户外广告
  • spring整合使用xml方式整合Druid数据源连接池
  • 邮件系统SSL加密传输,保护你的电子邮件免受网络威胁
  • 基于SSM考研助手系统的设计
  • 小白对时序数据库的理解
  • 视频美颜平台是如何搭建的?基于直播美颜SDK源码的开发技术详解
  • 推荐一款三维数值建模软件:3DEC
  • C++ —— 《模板进阶详解》,typename和class的用法,非类型模板参数,模板的特化,模板的分离编译
  • 解决Github下载速度慢的问题
  • 青少年编程能力等级测评CPA C++五级试卷(2)
  • 数据结构 ——— C语言实现链式队列
  • 干丹岩教授
  • 公司怎么能帮员工统一管理朋友圈
  • Java 泛型 Lambda 表达式
  • 【TFR-Net】基于transformer的鲁棒多模态情感分析特征重构网络
  • 【算法】归并排序概念及例题运用
  • 包过滤防火墙在哪一层工作
  • 【动手学强化学习】part2-动态规划算法
  • 电商平台数据分析:从商品数据收集到挖掘的完整流程
  • arco-design 自定义table和for循环自定义form-item并添加自定义校验
  • 912.排序数组(桶排序)