免费的博客空间,漂亮的VuePress(三)

简介: 免费的博客空间,漂亮的VuePress

默认的主题提供了一个首页(Homepage)的布局 (用于 这个网站的主页)。想要使用它,需要在你的根级 README.mdYAML front matter 指定 home: true。以下是一个如何使用的例子:

---
home: true
heroImage: /hero.png
heroText: Hero 标题
tagline: Hero 副标题
actionText: 快速上手 →
actionLink: /zh/guide/
features:
- title: 简洁至上
  details: 以 Markdown 为中心的项目结构,以最少的配置帮助你专注于写作。
- title: Vue驱动
  details: 享受 Vue + webpack 的开发体验,在 Markdown 中使用 Vue 组件,同时可以使用 Vue 来开发自定义主题。
- title: 高性能
  details: VuePress 为每个页面预渲染生成静态的 HTML,同时在页面被加载的时候,将作为 SPA 运行。
footer: MIT Licensed | Copyright © 2018-present Evan You
---

设置完后,可以看到出现了我们想要的页面。

18.png

其他设置可参考其他帮助页面:https://vuepress.vuejs.org/zh/theme/default-theme-config.html#%E9%A6%96%E9%A1%B5


3. 发布到GitHub Pages

下一步就是将生成的网页发布到GitHub。直观的想法就是把项目build后的文件push到上文创建的Repository。实际上的做法却可以更“巧妙”一些。


将源文件提交到main分支。

通过GitHub的Actions,在上一步完成之后,自动build,并将结果提交到另一个分支(gh-pages)。

GitHub Pages指向gh-pages分支。

3.1 创建gh-pages分支

如下图,在下拉菜单中输入gh-pages,并点击下面的Create branch提示,会创建gh-pages分支。

19.png

3.2 将GitHub Pages指向gh-pages分支

如下图方式修改:

20.png

3.3 设置自动发布的Token

因为需要自动发布,设置用于发布的Token。

首先创建Token,依照下图逐步创建即可。

点击右上角的头像,选择Setting:

21.png

在打开的页面中点击Developer setting

22.png

选择Personal access tokens, 点击Generate token按钮创建一个新的Token

23.png

目录
相关文章
另辟蹊径,利用宝塔快速搭建一个VuePress博客
另辟蹊径,利用宝塔快速搭建一个VuePress博客
1684 0
另辟蹊径,利用宝塔快速搭建一个VuePress博客
|
9月前
|
网络安全 开发工具 git
从零开始搭建属于自己的hexo博客
整个搭建过程大概需要30分钟不到,请各位控制自己的时间~
105 0
|
10月前
|
JavaScript 搜索推荐 程序员
使用Hexo 搭建你的技术博客
使用Hexo 搭建你的技术博客
121 0
|
11月前
|
域名解析 网络协议 Shell
hexo博客功能扩展 - 使用七牛云作为图床服务
由于购买的是国外的域名,DNS解析较慢
117 0
|
JavaScript 应用服务中间件 Go
使用Hexo建立一个轻量、简易、高逼格的博客
在之前的一篇文章中,介绍了如何使用Hugo在[三分钟之内建立一个简单的个人博客系统](https://v3u.cn/a_id_81),它是基于go lang的,其实,市面上还有一款类似的静态页生成器,就是Hexo 读音/hækso/ ,它是基于node.js的,和Hugo一样,Hexo 正常来说,不需要部署到我们的服务器上,我们的服务器上保存的,其实是基于在hexo通过markdown编写的文章,然后hexo帮我们生成静态的html页面,然后,将生成的html上传到我们的服务器。简而言之:hexo是个静态页面生成、上传的工具。
使用Hexo建立一个轻量、简易、高逼格的博客
|
存储 弹性计算 安全
场景体验:基于函数计算快速搭建Vuepress博客
本场景介绍使用函数计算服务搭建一个Vuepress博客。
|
JavaScript
免费的博客空间,漂亮的VuePress(二)
免费的博客空间,漂亮的VuePress
494 0
免费的博客空间,漂亮的VuePress(二)
免费的博客空间,漂亮的VuePress(四)
免费的博客空间,漂亮的VuePress
243 0
免费的博客空间,漂亮的VuePress(四)
|
JavaScript
免费的博客空间,漂亮的VuePress(一)
免费的博客空间,漂亮的VuePress
403 0
免费的博客空间,漂亮的VuePress(一)
|
JavaScript
【开源博客】三个步骤学会Hexo快速生成精美博客!
最近学委跟小伙伴搞了一个py4ever 开源站点,使用的就是hexo。 下面是站点信息:py4ever开源站
193 0
【开源博客】三个步骤学会Hexo快速生成精美博客!