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里面

具体目录结构看上面图片

代码如下（示例）：

bash 复制代码

@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

bash 复制代码

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

%~d0
cd %~dp0

cd ..
npm run dev

pause

总结

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

main 主分支如下

并且 github 的 gh-pages 如下

写一个bat同时推送到主分支，打包后的dist推送到指定分支，很简单，gpt一下就好了。

以前没这个思路，我把viteress-notice拆分成2个仓库

源码push在gitee，然后把打包出来的dist传到github，每次要两次push，挺麻烦的

成功后看效果

下期搞点vitepress的扩展，例如左下角的总访问量