使用 vuepress + gitee-pages + gitee-go 搭建静态网站

准备

创建 & 运行项目,请参考 VuePress(v1):https://v1.vuepress.vuejs.org/zh/guide/

构建和推送静态网站

使用 npm 构建静态网站并将其推送到 Gitee Pages 页面服务托管的分支

方式一:shell 脚本

if [ ! -e package.json ]; then
  echo '请在 package.json 所在目录下执行该脚本!'
  exit
fi

if [ -d "docs/.vuepress/dist" ]; then
  rm -rf docs/.vuepress/dist
fi

echo '🚀 开始构建...'

npm run build # > /dev/null 2>&1

if [ $? -ne 0 ]; then
    echo "❌ 构建失败。请使用 npm run build 命令构建以查看详情"
    exit
fi

echo '🎉 构建成功!'

echo '开始将生成的静态网站推送至 gt-pages 分支'

cd docs/.vuepress/dist && git init  && git checkout --orphan gt-pages  \
&& git add .  && git commit -m "pushed by deploy.sh"  \
&& git remote add origin git@gitee.com:engureguo/ops.git  \
&& git push origin gt-pages --force  && rm -rf .git
## git@gitee.com:engureguo/ops.git 为远程仓库
## gt-pages 为静态网站部署分支

if [ $? -ne 0 ]; then
    echo "❌ 抱歉,推送失败了"
    exit
fi

echo '🎉 推送成功!'

方式二:Gitee Go 流水线

version: '1.0'
name: pipeline-20230214
displayName: pipeline-20230214
triggers:
  trigger: auto
  push:
    branches:
      prefix:
        - main
stages:
  - name: stage-5caca387
    displayName: 构建和推送
    strategy: naturally
    trigger: auto
    executor: []
    steps:
      - step: build@nodejs
        name: build_nodejs
        displayName: Nodejs 构建
        nodeVersion: 16.14.2
        commands:
          - npm config set registry https://registry.npmmirror.com
          - npm install && npm run build && cd docs/.vuepress/dist
          - git init . && git config --local init.defaultBranch master
          - git config --global user.email "your@email.com"
          - git config --global user.name "GiteeGo Pipeline"
          - git add . &&  git commit -m "pushed by gitee-go"
          - git push https://${USERNAME}:${ACCESS_TOKEN}@gitee.com/${GITEE_REPO} master:gt-pages --force
          # 配置有户名和密码:
          # 1.定义全局变量。在【通用变量】中创建 USERNAME 和 ACCESS_TOKEN
          # 2.定义流水线级别变量。编辑流水线 -> 变量设置 -> 引用变量 -> 保存!
        artifacts:
          - name: BUILD_ARTIFACT
            path:
              - ./docs/.vuepress/dist
        caches:
          - ~/.npm
          - ~/.yarn
        notify: []
        strategy:
          retry: '0'

更多内容,请参考:https://gitee.com/engureguo/ops

posted @ 2023-02-14 22:22  egu0o  阅读(70)  评论(0编辑  收藏  举报