用GitHub Pages和Hexo搭建个人博客小站

2020-04-20 15:17:45 浏览数 (1)

因为GitHub在国内太慢的原因，所以打算用gitee或者coding的，但是发现现在国内的代码托管商新建仓库都不支持自定义域名了，所以只能用回GitHub Pages来托管了。

废话不多说，直接开干。

安装Node.js

首先下载稳定版

Node.js官网

下载完，安装一路next。

最后安装好之后，按Win R打开命令提示符，输入node -v和npm -v，如果出现版本号，那么就安装成功了。

安装Git

为了把本地的网页文件上传到github上面去，我们需要用到分布式版本控制工具————Git

Git官网

安装选项还是全部默认。

安装完成后在命令提示符中输入git --version验证是否安装成功。

设置SSH和Git账户

设置user.name和user.email配置信息：

代码语言：javascript复制
git config --global user.name "你的GitHub用户名"
git config --global user.email "你的GitHub注册邮箱"

生成ssh密钥文件：

代码语言：javascript复制
ssh-keygen -t rsa -C "你的GitHub注册邮箱"

然后直接三个回车即可，默认不需要设置密码

然后找到C:/Users/(yourname)/.ssh的文件夹中的id_rsa.pub密钥，将内容全部复制

打开GitHub-Settings-SSH and GPG keys 页面，新建new SSH Key，名字随便，内容复制进去，输密码确认即可。

在Git Bash中输入ssh -T git@github.com，若显示出你的名字，则配置成功，如果没有，这一步涉及的操作重新检查一遍。

新建repository

打开GitHub， 在GitHub右上角点击“加号”-New repository-名字设为yourname.github.io（这里的yourname是名字，不是昵称，比如博主这里是cordinovet）-README初始化也要勾选-创建。

安装Hexo

在合适的地方新建一个文件夹，用来存放自己的博客文件，比如我的博客文件都存放在D:cordinovet.github.io目录下。

在该目录下右键点击Git Bash Here，打开git的控制台窗口，以后我们所有的操作都在git控制台进行，就不要用Windows自带的控制台了。

定位到该目录下，输入npm i hexo-cli -g安装Hexo。

安装完后输入hexo -v验证是否安装成功。

连接自有域名和Github

如果你自己没有域名，并且习惯于“yourname.github.io”这样的域名的话，此步可跳过。

到域名提供商或解析商设置CNAME

这里以DNSPod为例。 其中主机记录为你前面创建网站时输入的子域名（如果site.xxx.com，则子域名为site） 记录类型为CNAME 记录值为在github上设置的域名（如cordinovet.github.io） 其他默认 最后点确认

修改配置文件_config.yml

打开本地博客根目录下的_config.yml文件，这是博客的配置文件，在这里你可以修改与博客相关的各种信息。

修改前面的title,subtitle,author,keyword。(SEO需要)

自己想修改成什么就修改成什么。

同时修改url（url可以修改成自己有的域名，如site.wnag.com.cn,也可以修改成在github设置的域名，cordinovet.github.io）

最后，修改最后一行的配置（修改Git提交上去的途径）

将

代码语言：javascript复制
deploy:
    type:""

改成

代码语言：javascript复制
deploy:
  type: git
  repository: https://github.com/cordinovet/cordinovet.github.io
  branch: master

repository修改为你自己的github项目地址。

添加CNAME解析文件

进入本地博客文件夹 ，进入cordinovet.github.io/source目录下，创建一个记事本文件，输入你的域名，保存即可。

我的是“site.wnag.com.cn”，不用加http(s)://。

配置网站

初始化我们的网站，输入hexo init初始化文件夹，接着输入npm install安装必备的组件。

这样本地的网站配置也弄好啦，输入hexo g生成静态网页，然后输入hexo s打开本地服务器，然后浏览器打开http://localhost:4000/，就可以看到我们的博客。

若出现hexo s失败的问题，原因可能有二：其一是因为前面在修改配置文件_config.yml的时候，可能没配置好，多空格或少空格，其二可能是端口的问题，hexo s -p 2333改一下端口后再hexo s试试看。

设置hexo主题

这里博主用的是huno主题，主题很简约，且响应式设计做的不错。

附地址，按里面操作即可。

Huno

去Github绑定域名

登录GitHub，进入之前创建的仓库，点击settings，设置Custom domain，输入你的域名（site.wnag.com.cn)，点击save保存。

然后，进入本地博客cordinovet.github.io/source目录下，创建一个记事本文件，输入你的域名（site.wnag.com.cn)即可。

将本地博客上传至GitHub

命令如下：

代码语言：javascript复制
npm install --save hexo-deployer-git

hexo d

输入GitHub账号和密码即可。

到此大功告成。

另外可以不定时对远程仓库进行clone备份

对远程仓库进行clone备份

在github博客仓库下新建一个分支hexo，然后git clone到本地，把.git文件夹拿出来，放在博客根目录下。

然后git branch -b hexo切换到hexo分支，然后git add .，然后git commit -m "xxx"，最后git push origin hexo提交就行了。

参考

超详细Hexo Github博客搭建小白教程

GitHub Hexo 搭建个人网站详细教程

Hexo GitHub (Coding) Pages 搭建博客

版权所有：可定博客 © WNAG.COM.CN

本文标题：《用GitHub Pages和Hexo搭建个人博客小站》

本文链接：https://cloud.tencent.com/developer/article/1616960

特别声明：除特别标注，本站文章均为原创，本站文章原则上禁止转载，如确实要转载，请电联：wangyeuuu@qq.com，尊重他人劳动成果，谢过~

hexo github git npm ssh

0 人点赞