在github上搭建个人独立博客

这篇文章会给大家分享利用github pages搭建我的个人独立博客的过程,希望能帮助到一些想搭建独立博客的朋友。本文操作中所使用的操作系统为MacOS。

一、工具准备

1.下载nodejs

https://nodejs.org/zh-cn/download/
进入网站以后,根据自己的电脑系统,选择不同的平台下载。目前支持的主要平台是Windows,MacOS,Linux。下载的版本推荐是长期维护版,另外一个版本是最新尝鲜版,虽然包含了很多最新功能,但是有可能不太稳定,不太适合新人使用。

2.下载git

https://git-scm.com/downloads
进入网站以后,也是跟据自己的电脑系统选择相应平台。安装时基本就是按照它的提示,点击下一步即可。

3.测试安装结果

打开终端(Windows系统下需要管理员运行cmd),依次输入

node -v
npm -v
git -v

如果都能正常输出版本号,说明安装成功了,可以进入下一步操作。

4.安装hexo

npm install hexo-cli -g

这里比较旧的版本可能是npm install hexo -g,但是现在这个命令已经不用了

二、搭建仓库

1.注册登录github

登录成功以后,点击 Repositories -> New,进入新建仓库页面
在仓库名称处,输入 用户名.github.io (这里的用户名是你注册的用户名,一般是英文字母)
选择Public
选择Add a README file
最后,点击最下面的Create repository,完成仓库创建。

2.创建SSH key

打开终端,输入

ssh-keygen -t rsa -C "邮件地址"

然后连续4次敲入回车键,完成创建。
打开~/目录,寻找.ssh目录,这是一个隐藏目录,需要在Find中设置一下,把所有隐藏的目录显示出来才能看到。在Windows系统下的目录应该是C:\Users\用户名。
在.ssh目录中,以文本方式打开id_rsa.pub文件,并复制里面的内容。

然后打开github,点击右上角图形,在弹出菜单中选技Settings,进入设置页面。
选择SSH and GPG keys菜单,在SSH keys项上点击New SSH key,在弹出框中粘贴刚才id_rsa.pub的文件内容。

现在,可以测试一下是否成功了,在终端中输入

ssh -T git@github.com

回车,然后再输入yes。

三、在本地生成博客内容

1. 在本地电脑上建一个博客目录,比如~/blog/,在终端上进入这个目录,然后运行

hexo init

我在运行时,报了如下错误:

(node:67639) ExperimentalWarning: The fs.promises API is experimental
INFO  Cloning hexo-starter https://github.com/hexojs/hexo-starter.git
INFO  Install dependencies
warning hexo-renderer-stylus > stylus > css > source-map-resolve@0.6.0: See https://github.com/lydell/source-map-resolve#deprecated
error hexo@6.3.0: The engine "node" is incompatible with this module. Expected version ">=12.13.0". Got "11.13.0"
error Found incompatible module.
WARN  Failed to install dependencies. Please run 'npm install' in "/Users/tianlibin/blog" folder.

从错误信息上可以看出来,是我本地的node版本太低了,因为hexo要求node最低版本是12.13.0。升级了本机的node版本后,问题解决。

2. 运行

hexo generate

注:此命令可简写为 hexo g

3. 运行

hexo server

注:命令可简写为 hexo s
如果上述命令运行失败,有可能是国内与github的连接不太稳定,可以尝试重复几次,直到成功。
每次写好文章之后,也可以运行这个命令,来预览文章的效果。

hexo server命令运行成功后,输出如下:

INFO  Validating config
INFO  Start processing
INFO  Hexo is running at http://localhost:4000/ . Press Ctrl+C to stop.

在浏览器地址栏里打开 http://localhost:4000/ ,即可看到一个博客DEMO页面
可以按 control+C,结束服务。

4. 修改_config.yml

在博客目录下,找到_config.yml文件,找到 Site模块,修改

# Site
title: '给博客取个大标题'
subtitle: '给博客取个副标题'
description: ''
keywords:
author: 
language: en
timezone: ''

在这里可以修改网站的标题、副标题、描述、关健字、作者、语言等信息。

另外,找到最下面的Deployment模块
原始内容如下:

# Deployment
## Docs: https://hexo.io/docs/one-command-deployment
deploy:
  type: ''

修改如下

# Deployment
## Docs: https://hexo.io/docs/one-command-deployment
deploy:
  type: git
  repository: git@github.com:xxx/xxx.github.io.git
  branch: main

这里有几点需要注意一下

  • type,repository,branch三个关健字,前面都有两个空格,冒号后面有一个空格,这里不能把空格删掉
  • type和branch后面的值都是固定的,repository后面的值,需要到github上找你创建的那个仓库,点击Code按钮,复制git的链接。(为了后面提交代码方便,尽量复制git链接,而不是https链接)

四、博客上线

1. 安装自动部署发布工具

npm install hexo-deployer-git --save

然后在终端依次输入

hexo g(生成)
hexo d(上传)

接下来我们就成功把本地内容上传到github了
上传成功以后,我们就算搭建好了!上自己的网址看看吧
网址是我们之前设的仓库名:用户名.github.io

2. 写文章

我们在Blog目录下,在终端中输入以下命令,就可以生成新的文章文件

hexo new 文章标题

文章是.md格式,在我们的Blog文件夹中的source/_posts中。
我个人是使用有道云笔记录来编辑md文件,支持所见即所得。

3. 上传文章

文章写好以后,还是输入,即可发布。

hexo g(生成)
hexo d(上传)

至此,我们就成功搭建好基本的博客了,剩下的就是对博客的一些优化和美化了。文章来源地址https://uudwc.com/A/6AmN

原文地址:https://blog.csdn.net/tlb203/article/details/128619163

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请联系站长进行投诉反馈,一经查实,立即删除!

h
上一篇 2023年06月16日 20:47
支付宝小程序授权/获取用户信息
下一篇 2023年06月16日 20:47