GitHub 如何部署写好的H5静态页面

news2024/11/25 6:36:34

感谢@粉皮zu的私信,又有素材写笔记了。(●’◡’●)

刚好记录一下我示例代码的GitHub部署配置,以便于后期追加仓库。

效果

img

环境

  • git
  • win

步骤

第一步 新建仓库

img

第二步 拉取代码

img

将仓库clone到本地

git clone 地址

img

第三步 部署文件

新建.github\workflows\static.yml文件

# Simple workflow for deploying static content to GitHub Pages
name: Deploy static content to Pages

on:
  # Runs on pushes targeting the default branch
  push:
    branches: ["main"]

  # Allows you to run this workflow manually from the Actions tab
  workflow_dispatch:

# Sets permissions of the GITHUB_TOKEN to allow deployment to GitHub Pages
permissions:
  contents: read
  pages: write
  id-token: write

# Allow one concurrent deployment
concurrency:
  group: "pages"
  cancel-in-progress: true

jobs:
  # Single deploy job since we're just deploying
  deploy:
    environment:
      name: github-pages
      url: ${{ steps.deployment.outputs.page_url }}
    runs-on: ubuntu-latest
    steps:
      - name: Checkout
        uses: actions/checkout@v3
      - name: Setup Pages
        uses: actions/configure-pages@v2
      - name: Upload artifact
        uses: actions/upload-pages-artifact@v1
        with:
          # Upload entire repository
          path: '.'
      - name: Deploy to GitHub Pages
        id: deployment
        uses: actions/deploy-pages@v1
第四步 将写好的代码复制到根目录下

目录结构例如

img

运行测试这里推荐使用Visual Studio Code + Live Server测试代码很方便。

第五步 提交代码
git add .
git commit -m '第一次提交'
git push

然后就会发现部署失败了😅

第六步 设置仓库

img

然后将Action中错误的流水线重新运行

然后就就就…可以了…哈哈哈哈

img

成功之后这里会出现在线地址

地址

仓库 https://github.com/ToMeShare/H5.Examples

在线 https://tomeshare.github.io/H5.Examples/

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/873212.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

线性规划模型-应用篇

文章目录 模型特点使用技巧工具包和求解器模型线性化 应用实例经验总结 模型特点 上一篇中,详细阐述了线性规划问题和单纯形法的算法原理,本文将着重介绍线性模型在工业场景中的应用。 首先需要说清楚的是,为什么线性模型深受研发人员青睐。…

五、约束编程求解优化问题

文章目录 1、瑶草问题-离散优化问题2、重试优化3、分支限界法-改进重试优化法4、重启式搜索4.1 重启方针/策略4.2 自动化搜索策略 THE END 1、瑶草问题-离散优化问题 \qquad 要求在一个建木上构建一个完整的分枝树,每一个完整的分枝有100段,完整分枝上的…

2023年《开学第一课》播出时间是什么时候?开学第一课怎么在手机上观看高清直播?

2023年《开学第一课》播出时间是什么时候? 根据往年《开学第一课》播出时间预计2023年《开学第一课》播出时间是2023年9月1日20:00,如有变化请以官方公布为准; 2023年开学第一课怎么在手机上观看高清直播? 1、打开手机微信&…

第三章,矩阵,07-用初等变换求逆矩阵、矩阵的LU分解

第三章,矩阵,07-用初等变换求逆矩阵、矩阵的LU分解 一个基本的方法求 A − 1 B A^{-1}B A−1BLU分解例1,求矩阵A的LU分解:例12,LU分解解线性方程组: 玩转线性代数(19)初等矩阵与初等变换的相关应用的笔记&a…

Rx.NET in Action 第一章学习笔记

Part 1 初入反应式扩展 什么是反应式程序?它们有什么用?使用反应式扩展(Rx)编程,会如何改变你编写代码的方式?在开始使用 Rx 之前应该做些什么?为什么 Rx 比传统的事件驱动编程更好&#xff1f…

简单认识Zabbix监控系统及配置

文章目录 一、zabbix概述1、定义2、zabbix监控原理3、监控对象4、zabbix的3种架构(1) C/S架构(2)分布式架构:zabbix-proxy-client架构(3) master-node-client架构 5、zabbix监控模式 二、部署za…

Apollo Planning2.0决策规划算法代码详细解析 (1):环境搭建

背景: apollo开源团队近期更新了planning版本,对代码进行了一定程度上的重构。 重构后代码结构更加清晰,对扩展更为友好;此外,也更新了dreamview对pnc的支持,使得调试更加方便。 本教程将继续更新对于Apollo Planning2.0决策规划算法代码的详细解析,便于大家更好理解…

[鹏城杯 2022]简单包含

直接用php:// 有wtf 加脏数据绕过

Spring boot中的线程池-ThreadPoolTaskExecutor

一、jdk的阻塞队列: 二、Spring boot工程的有哪些阻塞队列呢? 1、默认注入的ThreadPoolTaskExecutor 视频解说: 线程池篇-springboot项目中的service层里简单注入ThreadPoolTaskExecutor并且使用_哔哩哔哩_bilibili 程序代码:…

Impala实践:解析glog打印的 C++ 报错堆栈

Impala实践:解析glog打印的 C 报错堆栈 Impala使用glog生成日志。生产环境用的都是release build,glog产生的报错堆栈里没有函数名,很难像Java报错堆栈那样方便定位问题。下面是 Impalad 日志中的一个报错: I0522 09:07:16.0020…

浅复制和深复制(使用python)

在编程语言中,复制通常是通过赋值操作来实现的。具体实现方式可能因编程语言而异。 1. 浅复制(Shallow Copy) 浅复制是指创建一个新对象,新对象的内容是原始对象的引用。换句话说,新对象和原始对象共享相同的数据&am…

【JVM】JVM 调优的参数都有哪些?

文章目录 1. 设置堆空间大小2. 虚拟机栈的设置3. 年轻代中Eden区和两个Survivor区的大小比例4. 年轻代晋升老年代阈值5. 设置垃圾回收收集器 1. 设置堆空间大小 设置堆的初始大小和最大大小,为了防止垃圾收集器在初始大小、最大大小之间收缩堆而产生额外的时间&…

【Linux系统编程】21.echo、env、fork、getpid、getppid

目录 echo PATH SHELL TERM LANG HOME env fork 返回值 getpid getppid 测试代码1 测试结果 测试代码2 测试结果 父子进程相同 父子进程不同 父子进程共享 echo 查看单个环境变量。 PATH 可执行文件的搜索路径。 SHELL 当前Shell。 TERM 当前终端类型。终端…

一休休的面试题

重点面试题(今天又看了很多的博客大概有个三十来篇吧所以总结了一休休的面试题): ps:已经入秋了为什么还是这么热!!! 1、受管 bean 的生命周期 对于普通的 Java 对象,new 的时候会去创建对象,而当它没有…

Redis进阶(3)——在Linux上基于Docker容器Redis搭建一主二从三哨兵 SpringBoot整合Redis哨兵

目录 引出redis主从搭建:一主2从6389Master准备文件redis.confredis.log日志文件运行容器查看日志方式tail 6390Slave6391Slave 创建3哨兵创建文件夹sentinel创建运行哨兵容器问题:脑裂问题 SpringBoot整合Redis哨兵启动1主2从,3哨兵pom.xml文…

聊聊服务端缓存那些事(预热、淘汰、污染、雪崩、穿透、击穿等)

文章目录 概要一、缓存预热二、缓存污染2.1、先更新数据库再更新缓存2.2、先更新缓存再更新数据库2.3、先删除缓存再更新数据库,读时再更新2.4、先更新数据库再删除缓存,读时再更新2.5、缓存污染总结2.6、删除缓存失败了怎么办?2.7、延迟双删…

【数据结构与算法】十大经典排序算法-堆排序

🌟个人博客:www.hellocode.top 🏰Java知识导航:Java-Navigate 🔥CSDN:HelloCode. 🌞知乎:HelloCode 🌴掘金:HelloCode ⚡如有问题,欢迎指正&#…

JZ33二叉搜索树的后序遍历序列

题目地址:二叉搜索树的后序遍历序列_牛客题霸_牛客网 题目回顾: 解题思路: 使用栈 栈的特点是:先进后出。 通读题目后,我们可以得出,二叉搜索树是左子节点小于根节点,右子节点大于根节点。 …

wps设置一键标题字体和大小

参考 wps设置一键标题字体和大小:https://www.kafan.cn/A/7v5le1op3g.html 统一一键设置

[FPGA IP系列] 2分钟了解FPGA中的BRAM

FPGA设计中,BRAM是一项非常关键的内置存储资源,FPGA开发需要熟练使用BRAM,今天再复习一下BRAM的知识,包括BRAM的定义、组成、应用等等。 一、BRAM介绍 1、BRAM的定义 RAM是Random Access Memory,也就是随机访问数据…