第1章-零基础搭建个人博客 | HEXO的基本使用

零基础HEXO搭建个人博客之HEXO安装及其初始化

引言: 很多小伙伴都希望搭建一个属于自己的博客平台,今天这篇文章教会大家如何0基础也能搭建个人博客,我们使用Hexo来帮助我们搭建个人博客~

准备

1. 安装git–git官网

2. 安装nodejs–nodejs官网

3. 注册github–创建一个和Username一样名称的仓库

   Tips: 创建仓库名如果与Username不一致,请在下文初始化博客和配置博客文件时使用和仓库名一样的名字!!! 访问链接https://仓库名.github.io访问

Git

1. 在任意文件夹里,点击鼠标右键,选择Git bash here,打开git bash输入配置信息

   git config --global user.name "用户名"
   git config --global user.email "邮箱地址"
   

   # 例如:
   git config --global user.name "hongsheng-xu"
   git config --global user.email "[email protected]"
   

2. 在git bash 里输入

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

   #例如: 
   ssh-keygen -t rsa -C  "[email protected]"
   

控制台输出如下:

Enter file in which to save the key (/c/Users/13949/.ssh/id_rsa):
Created directory '/c/Users/13949/.ssh'.
Enter passphrase (empty for no passphrase):
Enter same passphrase again:
Your identification has been saved in /c/Users/13949/.ssh/id_rsa
Your public key has been saved in /c/Users/13949/.ssh/id_rsa.pub
The key fingerprint is:
#后文输出省略......

# 打开目录--控制台第二行输出Created directory '/c/Users/13949/.ssh'.其中ssh的存放路径为:
C:\Users\13949\.ssh
# 打开github>点击个人头像>点击设置(Settings)>点击SSH and GPG keys>New SSH key>在路径:C:\Users\13949\.ssh记事本打开id_rsa.pub文件,复制全部到New SSH key中key内容里

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-z9S0rQli-1612160561543)(https://s3.ax1x.com/2020/12/08/rSdmMn.md.png)]

Hexo安装

hexo文档

hexo安装

# 安装hexo, win+R,输入cmd 打开控制台输入: 
e: 
md blog
cd blog
npm install hexo-cli -g
#列如: 
C:\Users\13949>e:
E:\>md blog
E:\>cd blog
E:\blog>npm install hexo-cli -g

Tips: 通过上述代码在E盘创建了一个名为blog的文件夹,接下来我们需要做的就是初始化个人博客

Hexo初始化

#在blog文件夹下初始化博客 hexo init 博客名
hexo init hongsheng-xu
#进入博客所在文件夹
cd hongsheng-xu
#安装依赖
npm i
#安装插件
npm i hexo-deployer-git --save
#运行博客
hexo sever
#上一步也可以这样写--运行博客并指定端口名
hexo s -p 8080

#列如:
E:\blog>hexo init hongsheng-xu
E:\blog>cd hongsheng-xu
E:\blog>hongsheng-xu>npm i
E:\blog>hongsheng-xu>npm i hexo-deployer-git --save
E:\blog>hongsheng-xu>hexo sever

**输入hexo sever后你会看到控制台输出如下: **

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

完成这一步,nodejs会建立一个本地服务器通常会向Windows请求相关权限

你可以复制地址 http://localhost:4000到浏览器的地址栏,回车就能看到个人博客啦!

同时按住ctrl+c可以停止服务器的运行

搭建好的个人博客大概长这样:

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-5QFoXJpC-1612160561545)(https://s3.ax1x.com/2020/12/08/rSBmMd.md.png)]

Hexo发布至github

1. 修改博客子目录下_config.yml

   [外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-Wl47JASJ-1612160561546)(https://s3.ax1x.com/2020/12/10/ri3Y7T.png)]

   修改为https://仓库名.github.io 这样就可以通过仓库名.github.io去访问个人博客

   [外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-XOfRx84b-1612160561548)(https://s3.ax1x.com/2020/12/10/ri3Dj1.png)]

   找到deploy加入几行代码

   [外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-4zgK1OIw-1612160561550)(https://s3.ax1x.com/2020/12/10/ri8V29.png)]

# Deployment
## Docs: https://hexo.io/docs/one-command-deployment
deploy:
  type: git
  branch: master
  repo: https://github.com/hongsheng-xu/hongsheng-xu.github.io.git

Tips: 这里type指定为git,branch指定为master,如果你有新建分支可以提交到其他分支上,repo里写上自己仓库的地址>打开github>进入自己的博客仓库(博客名.gthub.io这个仓库)>点击下载code>复制地址

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-dUFaWldi-1612160561551)(https://s3.ax1x.com/2020/12/10/ri8XdK.png)]

2. 在博客所在的文件夹下点击右键打开git bash安装hexo-deployer-git

   

# 在bash里输入以下代码,下载hexo-deployer-git依赖
npm install hexo-deployer-git --save

3. 接着在bash里,编译代码hexo g

hexo g

4. 上传代码(提交到分支) hexo d

hexo d

以后就可以通过https://仓库名.github.io/去访问个人博客了,例如https://hongsheng-xu.github.io

sh里,编译代码hexo g

hexo g

4. 上传代码(提交到分支) hexo d

hexo d

以后就可以通过https://仓库名.github.io/去访问个人博客了,例如https://hongsheng-xu.github.io