Linux下使用 github+hexo 搭建个人博客01-hexo搭建

踏歌行

发布于 2020-10-15 14:59:32

2.2K0

发布于 2020-10-15 14:59:32

文章被收录于专栏：踏歌行的专栏踏歌行的专栏踏歌行的专栏

为什么要搭建自己的博客系统？

原因有好几个吧，归类如下： 1、自己搭建博客系统很有成就感，可以自己选定页面风格和页面排版；

2、自己搭建博客系统可以根据自己的需要添加各种插件功能，因此整体上比网上的第三方博客网站更好；

3、hexo 支持 MarkDown 标记语法，我们可以很容易的上手，排版简单明了；

4、网上主流的第三方博客网站，不一定很符合你个人的风格，而且由于网站要持续运营下去，因此在此过程中会不可避免的接入广告。当然这点我们也要理解，要允许网站有盈利，这样才能一直为大家服务下去；

5、第三方博客网站肯定会有系统升级，因此会时有出现各种改版的情况，你之前写的博文可能不符合新版本，造成之前的博文排版变得奇丑无比，简直令人崩溃「当然这种情况很少」。还有就是如果改版后符合你的操作习惯那还好，如果不符合那你就有点方了。

6、第三方博客网站有时会出现其他问题。最常见的就是博客页面改版「上一条说过」和图片加载不出来的情况等等。

大概就是上述几条吧，如果你还有其他的原因，欢迎你在文章底部留言！

说明：如果要把 hexo 生成的静态文件对外提供访问，那么请使用 Nginx 完成。 Nginx的部分配置如下：

 1 server {
 2     listen       80;
 3     server_name  www.zhangblog.com zhangblog.com 120.27.48.179;
 4     access_log  logs/access.log  main;
 5 
 6     location / {
 7         alias   /app/softinsall/hexo/public/;
 8         index  index.html index.htm;
 9     }
10     error_page   500 502 503 504  /50x.html;
11     location = /50x.html {
12         root   html;
13     }
14 }

本次部署的机器信息

机器系统：CentOS Linux release 7.5
IP地址：120.27.48.179

因为该博客本人会长期维护和支持下去，因此我是在阿里云购买的机器。　　

域名解析【可省略】

由于这个博客系统是我以后经常使用并且持续维护，因此我在阿里云购买了域名并且进行了备案。域名为：zhangblog.com 。并将域名 zhangblog 解析到了 120.27.48.179。

如果你只是个人测试使用，或者没有自己的域名，那么该项可省略。

安装 Git

[root@zhangblog ~]# yum install -y git

具体使用处 1、后续在 hexo 安装不同的主题时，会使用Git方式获取这些主题； 2、将 hexo 与自己的 GitHub Pages 结合时。

node.js 安装

nodejs 下载

官网地址：

http://nodejs.cn/download/

为了方便，我们直接下载二进制版本。这样就省去了编译安装步骤。

二进制安装包下载

1 [root@zhangblog software]# pwd
2 /app/software
3 [root@zhangblog software]# wget https://npm.taobao.org/mirrors/node/v10.16.0/node-v10.16.0-linux-x64.tar.xz  # 下载二进制安装包

nodejs 部署

 1 [root@zhangblog software]# pwd
 2 /app/software
 3 [root@zhangblog software]# tar xf node-v10.16.0-linux-x64.tar.xz 
 4 [root@zhangblog software]# mv node-v10.16.0-linux-x64 /app/softinsall/
 5 [root@zhangblog software]# cd /app/softinsall/
 6 [root@zhangblog softinsall]# pwd
 7 /app/softinsall
 8 [root@zhangblog softinsall]# ln -s node-v10.16.0-linux-x64 nodejs
 9 [root@zhangblog softinsall]# ll
10 total 4
11 lrwxrwxrwx 1 root root   23 Jun  4 15:59 nodejs -> node-v10.16.0-linux-x64
12 drwxrwxr-x 6  500  500 4096 May 29 05:36 node-v10.16.0-linux-x64

版本信息

1 [root@zhangblog bin]# pwd
2 /app/softinsall/nodejs/bin
3 [root@zhangblog bin]# ./node -v
4 v10.16.0

创建软连接

1 [root@zhangblog bin]# ln -s /app/softinsall/nodejs/bin/node /usr/local/bin/node 
2 [root@zhangblog bin]# ln -s /app/softinsall/nodejs/bin/npm  /usr/local/bin/npm

hexo 常用操作

如果熟悉 hexo 命令，那么可以忽略这一节。

hexo 操作命令官网

https://hexo.io/docs/commands

$ hexo init [folder] 初始化一个网站。如果没有提供文件夹，Hexo将在当前目录中创建网站。

$ hexo new [layout] 创建新文章。如果没有提供布局，Hexo 将使用 _config.yml 中的 default_layout 项提供的布局。如果标题包含空格，用引号括起来。

$ hexo generate

简写：hexo g

生成静态文件。

可选项

-d, --deploy

生成静态文件完成后部署

$ hexo server

简写：hexo s

启动本地服务器。默认情况下，这是在 http://localhost:4000/

可选项

-p, --port

使用端口，覆盖默认端口

$ hexo deploy

简写：hexo d

部署你的网站。

可选项

-g, --generate

完成部署之前，生成静态文件。

$ hexo clean 清除缓存文件(db.json)和生成的文件(public)。使用新主题或想重新生成静态文件时可使用

$ hexo version 版本信息

 1 [root@zhangblog hexo]# hexo version
 2 hexo: 3.8.0
 3 hexo-cli: 2.0.0
 4 os: Linux 3.10.0-862.14.4.el7.x86_64 linux x64
 5 http_parser: 2.8.0
 6 node: 10.16.0
 7 v8: 6.8.275.32-node.52
 8 uv: 1.28.0
 9 zlib: 1.2.11
10 brotli: 1.0.7
11 ares: 1.15.0
12 modules: 64
13 nghttp2: 1.34.0
14 napi: 4
15 openssl: 1.1.1b
16 icu: 64.2
17 unicode: 12.1
18 cldr: 35.1
19 tz: 2019a

hexo 部署

[root@zhangblog ~]# npm install hexo-cli -g  # 安装 hexo

将 hexo 命令添加到全局，采用软连接方式。

1 [root@zhangblog bin]# pwd  # hexo 命令所在目录
2 /app/softinsall/nodejs/lib/node_modules/hexo-cli/bin
3 [root@zhangblog bin]# ln -s /app/softinsall/nodejs/lib/node_modules/hexo-cli/bin/hexo /usr/local/bin/hexo

部署 hexo 博客环境

部署 hexo

可以放在和 nodejs 同层级的目录。

 1 [root@zhangblog softinsall]# pwd
 2 /app/softinsall
 3 [root@zhangblog softinsall]# mkdir hexo
 4 [root@zhangblog softinsall]# cd hexo/
 5 [root@zhangblog hexo]# hexo init  # 新建一个网站，默认在目前的文件夹建立网站。
 6 [root@zhangblog hexo]# ll 
 7 total 168
 8 -rw-r--r--   1 root root   1765 Jun  4 16:14 _config.yml
 9 drwxr-xr-x 285 root root  12288 Jun  4 16:15 node_modules
10 -rw-r--r--   1 root root    443 Jun  4 16:14 package.json
11 -rw-r--r--   1 root root 138442 Jun  4 16:15 package-lock.json
12 drwxr-xr-x   2 root root   4096 Jun  4 16:14 scaffolds
13 drwxr-xr-x   3 root root   4096 Jun  4 16:14 source
14 drwxr-xr-x   3 root root   4096 Jun  4 16:14 themes
15 [root@zhangblog hexo]# ll themes/  # 查看自带的主题
16 total 4
17 drwxr-xr-x 6 root root 4096 Jun  4 16:14 landscape

启动环境测试

 1 [root@zhangblog hexo]# hexo g  # 生成静态文件
 2 [root@zhangblog hexo]# ll
 3 total 200
 4 -rw-r--r--   1 root root   1765 Jun  4 16:14 _config.yml
 5 -rw-r--r--   1 root root  25063 Jun  4 16:26 db.json
 6 drwxr-xr-x 285 root root  12288 Jun  4 16:15 node_modules
 7 -rw-r--r--   1 root root    447 Jun  4 16:26 package.json
 8 -rw-r--r--   1 root root 138442 Jun  4 16:15 package-lock.json
 9 drwxr-xr-x   7 root root   4096 Jun  4 16:26 public    # 生成的静态文件
10 drwxr-xr-x   2 root root   4096 Jun  4 16:14 scaffolds
11 drwxr-xr-x   3 root root   4096 Jun  4 16:14 source
12 drwxr-xr-x   3 root root   4096 Jun  4 16:14 themes
13 [root@zhangblog hexo]# hexo s  # 启动服务，默认是 http://localhost:4000
14 INFO  Start processing
15 INFO  Hexo is running at http://localhost:4000 . Press Ctrl+C to stop.

端口信息

1 [root@zhangblog ~]# netstat -lntup | grep 'hexo'
2 tcp6   0  0 :::4000    :::*    LISTEN      7072/hexo

浏览器访问

http://www.zhangblog.com:4000/

更新 hexo 主题

获取NexT主题

该主题是我们以后长期使用的主题，后续的优化也是基于该主题进行。由于该主题风格和页面排版都很好，因此推荐大家使用。

1 [root@zhangblog hexo]# pwd
2 /app/softinsall/hexo
3 # 注意当前的目录， themes/next 指定存放的位置
4 [root@zhangblog hexo]# git clone https://github.com/theme-next/hexo-theme-next themes/next  # 新地址，当前维护中【但是有些细节不如老版本的】
5 # 或者 ***** 
6 [root@zhangblog hexo]# git clone https://github.com/iissnan/hexo-theme-next themes/next  # 老地址，没有维护了「推荐使用」

next 主题在 GitHub 有两个地址：

1 https://github.com/theme-next/hexo-theme-next    # 新地址，当前维护中
2 https://github.com/iissnan/hexo-theme-next       # 老地址，没有维护了

使用主题

 1 [root@zhangblog hexo]# hexo clean  # 清楚缓存和静态文件目录
 2 [root@zhangblog hexo]# vim _config.yml  # 修改该配置
 3 …………
 4 # Extensions
 5 ## Plugins: https://hexo.io/plugins/
 6 ## Themes: https://hexo.io/themes/
 7 theme: next
 8 …………
 9 [root@zhangblog hexo]# hexo g  # 生成静态文件
10 [root@zhangblog hexo]# hexo s -p 80  # 启动服务，指定端口

浏览器访问

http://www.zhangblog.com/

新建一篇博客

新建博客

 1 [root@zhangblog hexo]# pwd
 2 /app/softinsall/hexo
 3 [root@zhangblog hexo]# hexo new 'MarkDown_Use_Guide'
 4 INFO  Created: /app/softinsall/hexo/source/_posts/MarkDown_Use_Guide.md
 5 [root@zhangblog hexo]# cat source/_posts/MarkDown_Use_Guide.md   # 系统生成内容如下
 6 ---
 7 title: MarkDown_Use_Guide
 8 date: 2019-06-04 19:28:51
 9 tags:
10 ---

为博客添加内容—- Markdown 新手指南

  1 [root@zhangblog hexo]# pwd
  2 /app/softinsall/hexo
  3 [root@zhangblog hexo]# cat source/_posts/MarkDown_Use_Guide.md 
  4 ---
  5 title: MarkDown 新手指南
  6 date: 2019-06-04 19:28:51
  7 tags:
  8   - MarkDown
  9 categories:
 10   - MarkDown
 11 ---
 12 
 13 # 标题
 14 # 一级标题
 15 ## 二级标题
 16 ### 三级标题
 17 #### 四级标题
 18 ##### 五级标题
 19 ###### 六级标题 
 20 
 21 ---
 22 
 23 # 列表
 24 ## 无序列表
 25 - 文本1
 26 - 文本2
 27 - 文本3
 28 
 29 ## 有序列表
 30 1. 文本1
 31 2. 文本2
 32 3. 文本3
 33 
 34 ---
 35 
 36 # 链接、图片和引用
 37 ## 这是一个超连接
 38 [lightzhang 个人博客](http://www.zhangblog.com/)
 39 
 40 ## 这是一个站外图片链接
 41 ![示例图](https://www.cnblogs.com/images/logo_small.gif)
 42 
 43 ## 这是一个站内图片链接
 44 ![数字网络](/uploads/weixin_pulic_small.jpg)
 45 
 46 ## 这个一个引用
 47 > 宠辱不惊，看庭前花开花落；去留无意，望天上云卷云舒
 48 
 49 ---
 50 
 51 # 粗体和斜体
 52 从最开始的 *wordpress* ,到 *tale* ,到现在的**hexo**,网站变得越来越简单,越来越轻量级,这里主要说说**hexo**的使用。
 53 
 54 ---
 55 
 56 # 代码引用
 57 ## 多行代码
 58 ···
 59 「备注：实践中，请把前一行开头的 · 改为 `」
 60 #!/bin/bash
 61 ################ Version Info ##################
 62 # Create Date: 2018-09-29
 63 # Author:      Zhang
 64 # Mail:        zhang@xxxx.com
 65 # Version:     1.0
 66 # Attention:   脚本描述说明
 67 ################################################
 68 ···
 69 「备注：实践中，请把前一行开头的 · 改为 `」
 70 
 71 ## 单行代码  【只能一行】
 72 `
 73 /bin/sh echo "test" >> /dev/null
 74 `
 75 
 76 ---
 77 
 78 # 表格
 79 ## 书写格式1
 80 | Tables        | Are           | Cool  |
 81 | ------------- |:-------------:| -----:|
 82 | col 3 is      | right-aligned | $1600 |
 83 | col 2 is      | centered      |   $12 |
 84 | zebra stripes | are neat      |    $1 |
 85 
 86 ## 书写格式2
 87 dog | bird | cat
 88 ----|------|----
 89 foo | foo  | foo
 90 bar | bar  | bar
 91 baz | baz  | baz
 92 
 93 ## 书写格式3
 94 | 名称 | 系统版本 | 内网IP | Hostname |
 95 |--|--|--|--|
 96 | salt100 | CentOS7.5 | 172.16.1.100 | 10.0.0.100 |
 97 | salt01 | CentOS7.5 | 172.16.1.11 | 10.0.0.11 |
 98 | salt02 | CentOS7.5 | 172.16.1.12 | 10.0.0.12 |
 99 | salt03 | CentOS7.5 | 172.16.1.13 | 10.0.0.13 |
100 
101 # 字体或图片居中
102 
103 <center>
104 
105 **读万卷书，行万里路**
106 
107 </center>
108 
109 <center>
110 
111 ![数字网络](/uploads/avatar_small.png)
112 
113 </center>
114 
115 ---

站内图片位置

1 [root@zhangblog hexo]# pwd  # 站点位置
2 /app/softinsall/hexo
3 [root@zhangblog hexo]# ll source/uploads/
4 total 388
5 -rw-r--r-- 1 root root 131807 Apr 30 14:39 avatar.png
6 -rw-r--r-- 1 root root  16602 Jun  7 17:39 avatar_small.png
7 -rw-r--r-- 1 root root 209605 Jun  7 17:02 weixin_pulic.jpg
8 -rw-r--r-- 1 root root  19296 Jun 11 14:55 weixin_pulic_small.jpg

生成静态文件

1 [root@zhangblog hexo]# pwd
2 /app/softinsall/hexo
3 [root@zhangblog hexo]# hexo g  # 生成静态文件

浏览器访问

1 http://www.zhangblog.com/
2 http://www.zhangblog.com/2019/06/04/MarkDown_Use_Guide/