GitHub Pages上用vue搭建个人网站简记

已于 2024-07-30 10:52:30 修改
阅读量326 收藏
点赞数 3
分类专栏： Git 文章标签： github
于 2024-07-30 10:51:58 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/jerryqjr/article/details/140790952
版权

新建仓库

将仓库取名为:<你的用户名>.github.io
就像这样
在这里插入图片描述
GitHub会帮你自动部署在 https://jerryqjr.github.io/ 上

npm run build后把disk传入新的分支

git subtree push --prefix dist origin gh-pages

将子目录 dist 的内容推送到远程分支 gh-pages

随后在 Settings/Pages 页面中选择gh-pages分支即可完成

在这里插入图片描述

Jerry_ww
关注
专栏目录
Vue.js+Github打造个人网站GithubPages
进击的小宇宙
08-22 5180
本文介绍如何使用Vue.js开发一个独一无二的GithubPages。
github部署vue_如何将vue应用程序部署到github页面
weixin_26705651的博客
08-21 1188
github部署vueGitHub Pages is a great free option to deploy your Vue application. It’s a static site hosting service that takes files straight from a repository on GitHub. GitHub Pages是部署Vue应用程序的绝佳免费选择。 ...
手把手带你用 VuePress + Github Pages 搭建博客(2)
2401_84437982的博客
05-03 910
├─ docs我们在config.js配置如下：nav: […],sidebar: [title: ‘欢迎学习’,path: ‘/’,collapsable: false, // 不折叠{ title: “学前必读”, path: “/” }},title: “基础学习”,collapsable: false, // 不折叠{ title: “条件类型”, path: “/handbook/ConditionalTypes” },
使用 Vue 3 构建你的 GitHub 个人主页
spiker_的博客
08-15 1113
在这篇文章中，我将带你一步步从零开始使用 Vue 3 构建一个简单而美观的 GitHub 个人主页。如果你是初学者，不用担心，我会详细讲解每一步的操作，让你能够轻松上手。
Vue项目发布到GitHub Page的流程及相关小问题
Lil_y1的博客
07-11 1494
本文基于博主在上传Vue项目到GitHub上的步骤流程及碰到的一些报错和问题，现整理发布，初学者可以看看，希望可以帮助到对相关步骤不熟悉和遇到同样问题的你。
githubpages发布vue项目
qq_42312396的博客
05-05 749
前端Demo写完后，静态网页可以部署到gitbubpages，这里写一下自己部署的流程。 因为打包后的资源地址和开发环境不一样，所以先在vue.config.js文件里修改路径，没有文件的话就自己新建。我的版本是脚手架4.x，其他版本的路径修改会不一样，需要自己看一下。 项目npm run build后打包后会生成成dist文件夹 打包后把index.js放到本地测试，比如vscde的live-server插件 yua 打开github远程仓库，如果没有就建一个，将完整的项目先push到远程仓库。 可以
vue cli 3.x 项目部署到 github pages的方法
10-17
本文将详细讲解如何将 Vue CLI 3.x 项目部署到 GitHub Pages 上，以便于展示或分享你的纯静态项目。 1. **关于 GitHub Pages** GitHub Pages 是 GitHub 提供的一项免费服务，用于托管静态网页。你可以使用它来创建...
Vue 项目部署到GitHub Pages
GuAng
08-18 1257
运行后，git就会执行该文件里的命令。大致就是，构建打包项目代码，然后将打包后的代码上传到仓库中的 gh-pages 分支。要将项目部署到 https://.github.io// 上 (即仓库地址为 https://github.com//)，可将 publicPath 设为 “//”。在你的github项目的 Settings - Options 下的 GitHub Pages项里，可以看到你的项目线上网站地址。...
手把手带你用 VuePress + Github Pages 搭建博客，web前端开发现状
2401_84092169的博客
04-06 899
javascript是前端必要掌握的真正算得上是编程语言的语言，学会灵活运用javascript，将对以后学习工作有非常大的帮助。掌握它最重要的首先是学习好基础知识，而后通过不断的实战来提升我们的编程技巧和逻辑思维。这一块学习是持续的，直到我们真正掌握它并且能够灵活运用它。如果最开始学习一两遍之后，发现暂时没有提升的空间，我们可以暂时放一放。继续下面的学习，javascript贯穿我们前端工作中，在之后的学习实现里也会遇到和锻炼到。真正学习起来并不难理解，关键是灵活运用。
xyrena.github.io:我的个人网站，建立在GitHub Pages中
04-26
综上所述，"xyrena.github.io"项目是一个利用GitHub Pages服务搭建的个人网站，通过CSS进行样式设计，可能是为了展示个人资料、作品或分享思想。开发者通过编写和管理HTML、CSS代码来维护和更新这个网站，同时享受...
vue项目打包后上传至GitHub并实现github-pages的预览
11-28
vue项目打包后上传至GitHub，并实现github-pages的预览 1. 打包vue 项目 vue项目： 命令行输入打包命令npm run build，生成了dist文件夹： 打包完成。 打包常见问题1——项目资源无法加载 打开刚刚打包好的dist文件夹，浏览器打开index.html 发现该页面是空白的，打开控制台发现 这里看到index.html文件中没有加载任何css、js文件。 解决方法——修改config文件 打开项目根目录config下的index.js文件，进行如下修改： 即将assetsPublicPath: '/'改成assetsPublicPath
githubPage部署Vue项目
博客简介
09-03 1006
vue项目如何部署到github Page中
github pages 部署vue项目
啊哦
12-16 1314
1.新建分支 在项目中新建分支gh-pages，把项目打包后放到这个分支或者直接在这个分支打包 2.打包 找到vue.config.js文件 把这一行的值从 ‘/’ 改成 ‘./’ 点图上这个直接运行，或者cmd运行 npm run build:prod 目录中出现dist文件夹，这样就是打包好了 然后把框框里面这一部分文件夹移到项目根目录 【总之就是让这部分文件的位置处在gh-pages分支根目录下】 这个时候可以打开index.html看看能不能打开网页，能打开看的话说明打包的文件没问题 3
使用 GitHub Pages 部署 Vue 应用的教程及常见问题解决
最新发布
weixin_50762970的博客
10-16 1004
通过以上步骤，你应该能够顺利将 Vue 项目部署到 GitHub Pages 并解决可能遇到的常见问题。记得仔细检查中的根目录配置，并确保正确使用gh-pages来进行部署。这样，Vue 项目就可以稳定运行在 GitHub Pages 上，展示给用户。
github天天用，但是你知道他其实还可以用来部署前端应用吗
szqandpk的博客
05-02 382
前言 大多数人只知道github是开源社区，可以用来做项目的版本管理，但是其实他还有一些其他功能和小彩蛋。有没有和我一样不想花钱去购置服务器的，对，我穷。还记得当初用大学生的身份腾讯云买的一元云主机，甚是怀念鸭😄😄。如果你也是暂时只有前端应用需要部署的话，github其实就可以帮你，非常方便，只是可能因为某些不可抵抗原因，加载比较慢，这里你懂得~~ 直接上手搞 先整出一个项目，为了贴合实际应用场景，我这里用的是vue项目，用我自己写的脚手架vue2-admin-cli——顺便打个广告👋👋，创建一个vue-
Vue2.0结合iView快速搭建后台管理网站模板（附github源码地址）
热门推荐
yangyuscript的博客
12-16 2万+
一、项目背景： 尝试使用vue结合其UI框架iView快速搭建网站后台模板（在前后端分离的大背景下，传统的js、jquery已经不在是搭建前端的首选，尤其是mvvm模式下衍生出来的react.js、angular.js和vue.js等框架是的前端开发更加高效简洁，性能提高的同时，使得整个项目的前后端开发更加迅速有质。至于为何选择vue，原因如下：1.算是支持国产吧 2.vue似乎相比另外两个热门
Github上标星60K+，超火和超好看的10 个后台管理模版你知道几个
weixin_42686892的博客
12-10 1197
今天给大家带来的是 GitHub 上 10 个超火和超好看管理后台模版，希望你在这里面找到写 省时省力的模版！ Web 开发中几乎的平台都需要一个后台管理，但是从零开发一套管理后台模版并不容易，幸运的是有很多开源免费的管理后台模版可以给开发者使用。 那么有哪些优秀的开源免费的管理后台模版呢？ 我在 GitHub 上收集了一些优秀的管理后台模版，而且是还在不断更新和维护的项目，并总结得出 Top 10。 1. vue-Element-Admin vue-element-admin 是一个后台前端解决方案，它基
Vue项目打包部署到GitHub Pages
云间月
07-04 6299
Vue项目打包部署到GitHub Pages 前言 关于什么是github pages？怎样创建github 仓库上传本地项目到GitHub远程仓库？等基本操作本文不再赘述，初学者可以通过搜索找到大量文章教程。本文重点在于： 如何将vue项目源码（含dist目录）同步到到github仓库，同时单独将项目下的dist目录同步到gh-pages分支以便使用GitHub pages 发布和预览静态网页。 上述问题，作者以往的做法是将Vue项目源码托管到源码仓库，然后另外创建一个webpage仓库管理 前期
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

Jerry_ww

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

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

余额充值