部署Vue项目到githubPage中

上传Vue项目到githubPage

例如: 看我发布的地址

前提条件

1. github上有一个仓库并且仓库下有两个分支(main 和 gh-pages)

1.1 main分支保存你的vue项目源码(react或者其他框架的都行)
1.2 gh-pages分支保存的是你项目打包之后的代码(如Vue项目打包完之后是个dist包,则gh-pages文件夹存放dist目录下所有的文件,根目录下必须有index.html)

2. 如图在这里插入图片描述
3. 按步骤在github上设置,最后在第五步就能看到你的在线链接了
4. 需要注意的是:
4.1 你每次重新上传到gh-pages分支下无需在操作,它自己就会打包
   git add .git commit -m "备注"git push origin gh-pages
5. vue项目中
      // vue.confing.jsconst { defineConfig } = require('@vue/cli-service')module.exports = defineConfig({transpileDependencies: true,lintOnSave: false,publicPath: process.env.NODE_ENV === 'production' ? '/use-yt-ui' : '/'})// 根目录下新建 deploy.sh 文件#!/usr/bin/env sh# 当发生错误时中止脚本set -e# 构建npm run build# cd 到构建输出的目录下cd dist# 部署到自定义域域名# echo 'www.example.com' > CNAMEgit initgit add -Agit commit -m 'deploy'# 部署到 https://<USERNAME>.github.io# git push -f git@github.com:<USERNAME>/<USERNAME>.github.io.git master# 部署到 https://<USERNAME>.github.io/<REPO>git push -f git@github.com:ProgrammerMao-001/use-yt-ui.git master:gh-pagescd -
6. 发布成功

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

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

相关文章

【C++入门篇】保姆级教程篇【上】

目录 一、第一个C程序 二、C命名空间 1&#xff09;什么是命名空间&#xff1f; 2&#xff09;命名空间的使用 3&#xff09; std库与namespace展开 4&#xff09;命名空间的嵌套使用 三、输入输出方式 四、缺省参数 1&#xff09;什么是缺省参数&#xff1f; 2&#xff0…

未能为 SSL/TLS 安全通道建立信任关系

在 Windows早期版本&#xff08;Windows server 2008&#xff09;上运行web请求相关代码&#xff0c;提示错误&#xff1a;未能为 SSL/TLS 安全通道建立信任关系。 打开IE直接访问相关网址&#xff0c;按照提示信任网站&#xff0c;安装证书&#xff1a; 选择&#xff1a;将所有…

【计算机网络】NAT机制的工作流程

网络地址转换&#xff08;NAT&#xff09;是一种将私有IP地址转换为公共IP地址的技术&#xff0c;它使得私有网络中的主机可以在互联网上与外部主机进行通信。NAT机制在路由器或专用NAT设备上配置&#xff0c;可以用于家庭、小型企业或大型企业的网络环境中。本文将总结NAT机制…

0基础学习VR全景平台篇第112篇:控制点和遮罩工具 - PTGui Pro教程

上课&#xff01;全体起立~ 大家好&#xff0c;欢迎观看蛙色官方系列全景摄影课程&#xff01; 前情回顾&#xff1a;上节&#xff0c;我们用PTGui拼接了一张全景图&#xff0c;全景编辑器里的各项功能帮助我们进行了初步的检查和编辑。 之后我们需要使用【控制点】和【遮罩…

pytorch 入门 (四)案例二:人脸表情识别-VGG16实现

实战教案二&#xff1a;人脸表情识别-VGG16实现 本文为&#x1f517;小白入门Pytorch内部限免文章 参考本文所写记录性文章&#xff0c;请在文章开头注明以下内容&#xff0c;复制粘贴即可 &#x1f368; 本文为&#x1f517;小白入门Pytorch中的学习记录博客&#x1f366; 参…

华为数通方向HCIP-DataCom H12-831题库(多选题:21-40)

第21题 网络管理员A希望使用ACL匹配特定的路由条目,请问以下哪些路由条目将被图中的ACL规侧匹配? acl number 2000 rule 10 permit source 10.0.0.0 0.0.6.0A、10.0.0.1/32 B、10.0.0.0/24 C、10.0.1.0/24 D、10.0.2.0/24 答案: 解析: 通配符十进制6转换二进制为00000110,…

提升药店效率:山海鲸医药零售大屏的成功案例

在医药行业中&#xff0c;特别是医药零售领域&#xff0c;高效的药品管理和客户服务至关重要。随着科技的飞速发展&#xff0c;数字化解决方案已经成为提高医药零售管控效率的有效工具之一。其中&#xff0c;医药零售管控大屏作为一种强大的工具&#xff0c;正在以独特的方式改…

互联网Java工程师面试题·Spring篇·第二弹

目录 3、Beans 3.1、什么是 spring bean&#xff1f; 3.2、spring 提供了哪些配置方式&#xff1f; 3.3、spring 支持集中 bean scope&#xff1f; 3.4、spring bean 容器的生命周期是什么样的&#xff1f; 3.5、什么是 spring 的内部 bean&#xff1f; 3.6、什么是 spri…

ONEPIECE!程序环境和预处理——C语言最终章

时间过得飞快呀&#xff0c;从第一篇blog到现在&#xff0c;已经有三四个月的时间了&#xff0c;而我们终于也迎来了C语言的最终章——程序环境和预处理&#xff01;加油吧朋友们&#xff0c;ONEPIECE就在眼前~ 目录 一、程序的"翻译环境"和"运行环境" 二…

Biotech - 环状 mRNA 的 LNP 递送系统 与 成环框架

欢迎关注我的CSDN&#xff1a;https://spike.blog.csdn.net/ 本文地址&#xff1a;https://spike.blog.csdn.net/article/details/133992971 环状 RNA&#xff08;或 circRNA &#xff09;是一种单链 RNA&#xff0c;与线性 RNA 不同&#xff0c;形成一个共价闭合的连续环。在环…

Hadoop+Hive+Spark+Hbase开发环境练习

1.练习一 1.数据准备 在hdfs上创建文件夹&#xff0c;上传csv文件 [rootkb129 ~]# hdfs dfs -mkdir -p /app/data/exam 查看csv文件行数 [rootkb129 ~]# hdfs dfs -cat /app/data/exam/meituan_waimai_meishi.csv | wc -l 2.分别使用 RDD和 Spark SQL 完成以下分析&#xf…

零代码编程:用ChatGPT多线程批量将PDF文档转换为word格式

pdf2docx是Python的一个库&#xff0c;可以很方便的将PDF文档转换为word格式&#xff0c;首先安装这个库。 然后在ChatGPT中输入提示词&#xff1a; 你是一个Python编程专家&#xff0c;要完成一个文档格式转换的任务&#xff0c;具体步骤如下&#xff1a; 打开F盘的Books文件…

强化学习代码实战(1)

机器人领域&#xff1a;控制&#xff0c;规划&#xff0c;感知等都可以用&#xff0c;可以把它作为一个优化过程&#xff0c;那么任何需要优化的问题都可以用它解决。 1.应用 深度学习&#xff1a;智能感知&#xff0c;解决智能如何理解这个世界的问题。 强化学习&#xff1a…

python之代理ip的配置与调试方法详解

代理IP在Python中是一种强大的工具&#xff0c;它可以用于隐藏真实IP地址、绕过访问限制、提高数据爬取和网络请求的效率等。下面将详细介绍Python中代理IP的配置与调试方法&#xff0c;帮助您更好地理解和应用代理IP。 1. 选择合适的代理IP 在使用代理IP之前&#xff0c;需要…

vue v-for

目录 前言&#xff1a;Vue.js 中的 v-for 指令 详解&#xff1a;v-for 指令的基本概念 用法&#xff1a;v-for 指令的实际应用 1. 列表渲染 2. 动态组件 3. 表单选项 4. 嵌套循环 5. 键值对遍历 解析&#xff1a;v-for 指令的优势和局限性 优势&#xff1a; 局限性&a…

网络通信和tcp协议

一、计算机网络架构模型 1、OSI七层模型 2、TCP/IP模型 3、TCP/IP协议族 无论是什么网络模型&#xff0c;都是为上一层提供服务&#xff0c;抽象层建立在低一层提供的服务上&#xff0c;每层都对应不同的协议 4、地址和端口号 1&#xff09;MAC地址 MAC 地址共 48 位&#…

RAM(recognize anything)—— 论文详解

一、概述 1、是什么 RAM 论文全称 Recognize Anything: A Strong Image Tagging Model。区别于图像领域常见的分类、检测、分割&#xff0c;他是标记任务——即多标签分类任务&#xff08;一张图片命中一个类别&#xff09;&#xff0c;区分于分类&#xff08;一张图片命中一个…

Java基础(第一期):IDEA的下载和安装(步骤图) 项目结构的介绍 项目、模块、类的创建。第一个代码的实现

文章目录 IDEA1.1 IDEA概述1.2 IDEA的下载和安装1.2.1 下载1.2.2 安装 1.3 IDEA中层级结构介绍1.3.1 结构分类1.3.2 结构介绍project&#xff08;项目、工程&#xff09;module&#xff08;模块&#xff09;package&#xff08;包&#xff09;class&#xff08;类&#xff09; …

【Javascript】等于与全等于

var a1;if(a1){console.log(你好&#xff01;&#xff01;);} 如果a赋值为 1 的时候 var a1;if(a1){console.log(你好&#xff01;&#xff01;);}仍然会执行 console.log(你好&#xff01;&#xff01;); 所以在开发中如果if语句里要使用等于的时候使用 var a1;if(a1)…

基于Java的疫苗接种管理系统设计与实现(源码+lw+部署文档+讲解等)

文章目录 前言具体实现截图论文参考详细视频演示为什么选择我自己的网站自己的小程序&#xff08;小蔡coding&#xff09; 代码参考数据库参考源码获取 前言 &#x1f497;博主介绍&#xff1a;✌全网粉丝10W,CSDN特邀作者、博客专家、CSDN新星计划导师、全栈领域优质创作者&am…