项目部署到Github-Page

最新推荐文章于 2024-07-23 14:32:45 发布
最新推荐文章于 2024-07-23 14:32:45 发布
阅读量546 收藏
点赞数
分类专栏： 学习笔记 Git 文章标签： github git
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/Tang__CT/article/details/124750333
版权
本文介绍了在将Vue项目部署到Github Pages时遇到的问题及解决方法，包括查阅Vue Cli官方文档，设置正确的baseURL，以及如何创建和部署仓库。
摘要由CSDN通过智能技术生成

项目部署到Github-Page

问题描述

  • 在将项目部署到Github-Page时浏览不到项目页面

解决方法

  1. 在vue.config.js中设置正确的publicPath
    • 如果打算将项目部署到 https://<USERNAME>.github.io/ 上，publicPath 将默认被设为 “/”，你可以忽略这个参数
    • 如果打算将项目部署到 https://<USERNAME>.github.io/<REPO>/ 上 (即仓库地址为 https://github.com/<USERNAME>/<REPO>)，可将 publicPath 设为 “//”。
    • 举个例子，如果仓库名字为“my-project”，那么 vue.config.js 的内容应如下所示：
module.exports =
最低0.47元/天 解锁文章
Tangctt
关注
专栏目录
在GitHub Page上部署网页和搭建博客
纵身一跃
09-18 528
本文为本人2018年10月12日的笔记，搬运至此 文章目录1.起源2.注册GitHub账号3.创建Git仓库（Repository）3.本地配置Git4.克隆云端仓库到本地5.上传文件到云端仓库7.注意事项8.结尾 本篇记录了如何通过GitHub Page发布个人网页，以及搭建静态博客，也就是CMS(内容管理系统)。所以适合以下设计师阅读： 有一定前端知识或者会使用Markdown语法； 想在网页上显示点什么又不想麻烦去折腾域名和服务器； 有Mac电脑，我还没研究Windows。 相关文章有很多，官.
Vue 项目部署到GitHub Pages
GuAng
08-18 1262
运行后，git就会执行该文件里的命令。大致就是，构建打包项目代码，然后将打包后的代码上传到仓库中的 gh-pages 分支。要将项目部署到 https://.github.io// 上 (即仓库地址为 https://github.com//)，可将 publicPath 设为 “//”。在你的github项目的 Settings - Options 下的 GitHub Pages项里，可以看到你的项目线上网站地址。...
github将不同的仓库里面的项目部署到github pages
Haines
11-26 1270
想实现的效果： -假如我有a,b,c三个仓库，我的github用户名叫xxx -我想使用这样的url去访问不同的项目： https://xxx.github.io/a https://xxx.github.io/b https://xxx.github.io/c 实现步骤： a,b,c三者都是一个独立的仓库，所以操作原理都是一样的，这里拿a仓库举例子，设置如下： 1.点击se...
将代码部署到 GitHub Pages 的快速简易方法
大IT职男日志
09-03 621
将代码部署到 GitHub Pages 创建 GitHub 项目 创建项目的方法就不在这里讲了，不会的同学可以去搜索一下 将前端代码添加到 GitHub 项目仓库 首先要删除原先 MM项目中的.git 目录，在项目目录运行命令： $ cd MM $ rm -rf .git 然后初始化 git,并将 MM 前端代码添加到自己的项目仓库中 git init git remote add origin https://github.com/用户名/项目名.git 安装并部署 gh-pages 我们将通过.
如何将你的github仓库部署到github pages
CherishLyf
09-23 1460
注：此文章为转载，原文地址如何将你的github仓库部署到github pages第一步：新建一个github仓库”hello-ghpages”: 现在我们有了一个空的仓库，上面只有README.md和LICENCE文件，并且注意现在所在的分支是”master”。之所以强调这一点是因为接下来的步骤必须明确自己的github page在哪个分支下面，这个等会儿再介绍。第二步：点击页面右边一列的“Se
手把手教你将项目部署到GitHub上（非常详细）
热门推荐
weixin_42365757的博客
06-01 1万+
我是2018年下半年注册GitHub的，一直玩到现在也有挺长时间的了。决定向大家分享一下自己的经验。看到网上有很多教程，甚至B站上也有一些视频，但是好多一上来就是Git命令，要么就是一大堆的术语，让很多初学者看视频看教程依然还是云里雾里，不能解决问题。 因此今天决定写下该文章，让很多初学者柳暗花明又一村。 第一步： 你要拥有自己的GitHub账户（没有的去GitHub官网下载：(https://github.com/)） 第二步： 你需要下载安装Git。链接：https://git-scm.com/do
vue cli 3.x 项目部署到 github pages的方法
10-17
本文将详细讲解如何将 Vue CLI 3.x 项目部署到 GitHub Pages 上，以便于展示或分享你的纯静态项目。 1. **关于 GitHub Pages** GitHub Pages 是 GitHub 提供的一项免费服务，用于托管静态网页。你可以使用它来创建...
github-page.dev:GitHub帐户网页-Hugo开发资料库
03-11
开发者只需将内容更新推送到GitHub，自动化流程会自动构建Hugo项目并将结果发布到GitHub Pages。 8. **持续集成/持续部署(CI/CD)**：GitHub Actions是GitHub内置的CI/CD工具，可以自动检测仓库的代码变更，触发构建...
将Vue项目部署到Github Page上
主要分享大数据相关的知识，如Spark、Hudi
01-02 6344
前言 本文讲如何将Vue项目的dist文件夹部署到Github Page上，目的是可以在线访问前端效果，这样不需要自己购买服务器，当然任何静态文件夹都可以这样做，不止局限于Vue 操作步骤 1、首先在Git上建立一个项目，如vue-echarts-map 2、然后将本地项目push到远程master （非必须） echo "# vue-echarts-map" >> README.m...
Vue项目部署到Github Page
what to say
10-03 688
Vue项目部署到Github Page
三步搞定Github Pages自定义域名
qq_27346503的博客
06-07 1993
这里的三步的前提是指已经有一个域名并且已经完成了实名认证，Github Pages上的静态博客已经可以用github给的xxx.github.io正常访问了。 第一步 首先是用ping命令找到存放你的github pages的主机的IP地址，在终端里面用命令ping xxx.github.io便可完成，下图中红框内的就是我们要找的IP地址： ping命令 第二步 在购买域名的提供商为域名添加解析。我是在阿里云买的域名，因此我以阿里云的为例。在域名控制台选择想要绑定的域名，并点击解析： .
github pages gitee pages 配置教程、更新教程（亲测有效），gitee pages 访问界面为空白，样式和js文件404问题解决（亲测有效）
mrliucx的博客
07-02 9263
github pages配置教程、github部署vue打包项目通过：https://用户名.github.io/项目名 进行访问、并更新dist里面的文件到github即更新链接（亲测有效）
GitHub | Pages 部署 Vue 项目但页面空白，报错：net::ERR_ABORTED 404 (Not Found)
狂放不羁霸的博客
03-30 824
publicPath 指示了资源文件（如图片、CSS 文件等）的公共基础路径。例如，如果你的应用是部署在域名的根目录下，那么你的 publicPath 可能会是 '/'。如果部署在子目录下，比如 '/my-app/'，那么你就需要设置成这个值。当设置为 './' 时，通常意味着资源文件是相对于当前页面位置的。控制台报错说找不到这些资源，但是 dist 目录下都有这些 JS 文件啊，这是为什么？修改后重新 build 项目，再 push 到 GitHub 上。
利用github.io(githubPages)免费托管个人静态网站/个人博客
m0_58352785的博客
08-19 1358
利用github.io(githubPages)免费托管个人静态网站/个人博客
超实用!!! 三分钟将你的项目部署在github page上
王亮的博客
03-21 1557
超实用！！！三分钟将你的vite/webpack项目部署到github page上
全网最详细的GitHub Pages上部署项目
最新发布
共同进步
07-23 1327
无需购买服务器或进行复杂的配置，只需将静态文件推送到特定的分支，GitHub Pages就会自动为你托管网站。如果你的项目需要构建（例如使用 React、Vue 或 Angular），请确保已经构建好，并且所有构建输出文件在一个目录中（例如。如果你的项目是一个单页应用（SPA），你可能需要使用打包工具（如Webpack、Vite等）来构建项目。通过这些步骤，你可以轻松地在 GitHub Pages 上部署你的静态网站或项目。GitHub Pages 会自动生成一个 URL，你可以在上面访问你的项目。
如何使用Github Page搭建个人网站【踩坑实录&多图预警】
WHYbeHERE的博客
07-12 4933
使用GIthub Page 搭建个人网站的全过程记录
在github上部署静态页面
qq_58832911的博客
11-24 9367
假如你辛辛苦苦写好了一个静态网页，很想要炫耀一下，让大家都可以通过公网访问看到我的网页。这里有一种最简单的方式，使用gitpage功能，将你的网页通过gitpage部署，大家都可以通过公网看到你的网页了。
使用 github pages, 快速部署你的静态网页
weixin_34129696的博客
06-25 3032
使用 github pages, 快速部署你的静态网页 Github Pages 官网 Github Pages: Websites for you and your projects. Hosted directly from your GitHub repository. Just edit, push, and your changes are live. 前言 在日常工作中, 我们经常...
GitHub Wiki自动化更新：使用github-wiki-action同步文件
其中，"wiki"、"wiki-page"、"github-wiki"指的是与GitHub Wiki相关的功能，"github-actions"、"github-action"表示这是GitHub Actions的工作流，"github-actions-docker"指出了与Docker容器的结合，而"Shell"则表明...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值