简述

Hexo可以理解为是基于node.js制作的一个博客工具。它通过在本地编写markdown文档，然后生成静态html页面并上传至服务器。

本地hexo搭建

本地需要准备的工具git, node.js

安装NodeJS

浏览器进入NodeJS 官网：https://nodejs.org/zh-cn/，安装 LTS（Long Term Support）版本。安装完成后可以使用下面的命令查看版本。

node -v
npm -v

# 使用npm安装时出现进度条卡住的情况，换一个新的npm的镜像地址
npm config set registry https://registry.npmmirror.com

hexo搭建

这里给出hexo的官方文档https://hexo.io/zh-cn/docs/，可以作为参考。

1.安装hexo

npm install -g hexo-cli

# 使用npm安装时出现进度条卡住的情况，换一个新的npm的镜像地址
npm config set registry https://registry.npmmirror.com

# 使用hexo -v查看版本
hexo -v

2.本地搭建hexo

# 创建本地目录
mkdir Blog

# 初始化
hexo init

# 本地生成文件和查看
hexo g
hexo s

运行hexo s之后，可以在本地端口访问网站。

服务器端配置

创建文件保存目录

在想要保存网站文件的地方创建目录

1	mkdir /wwwBlog

安装nginx

# 安装nginx
sudo apt-get install nginx

# 启动nginx
systemctl start nginx

此时应该可以通过http://ip:80端口访问nginx的欢迎页，如果配置了DNS，也可以直接通过域名访问。

配置nginx

在/etc/nginx目录下有一个conf.d文件夹，在这个文件夹里面新建一个conf文件，内容如下

1	vim /etc/nginx/conf.d/blog.conf

server{

        listen 80;  # 监听端口

        root /wwwBlog;  # 指定网站文件目录

        server_name www.zhanghuiwan.com; # 指定域名

        location /{
         	# 其他配置，例如反向代理、缓存等

        }

}

这里其实可以在任何地方创建该配置文件，只需要在nginx.conf 包含该文件即可，注意是在http关键词下面。

此时如果在 /wwwBlog 目录下有一个html文件，则可通过网址直接访问该网页。这里给一个简单的index.html 。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>My Simple Website</title>
    <style>
        body {
            font-family: Arial, sans-serif;
            margin: 20px;
        }
        header {
            text-align: center;
            padding: 10px;
            background-color: #f2f2f2;
        }
        main {
            padding: 20px;
        }
    </style>
</head>
<body>

    <header>
        <h1>Welcome to My Simple Website</h1>
    </header>

    <main>
        <p>This is a basic example of an HTML file for a simple website.</p>
        <p>Feel free to replace this content with your own!</p>
    </main>

</body>
</html>

接下来的任务就是如何将hexo本地渲染的html文件上传到我们在服务器的目录下。

安装git和nodeJS

sudo apt-get update
sudo apt-get install git
sudo apt-get install nodejs

# 查看版本
node -v
git -v
git --version

设置git 免密登陆

创建git用户

# 添加用户
sudo adduser git

# 修改权限
sudo vim /etc/sudoers

# 在上面的文件中添加下面一行
git ALL=(ALL:ALL) ALL

设置免密登陆

su git
cd ~
mkdir .ssh
ssh-keygen
cd .ssh
cp id_rsa.pub authorized_keys

然后打开 authorized_keys 文件将本地 .ssh/id_rsa.pub中的内容粘贴在最后。

此时直接在本地登陆服务器时不需要密码。

1	ssh git@aliyun

配置git仓库

在服务器上使用git用户创建一个Git仓库，并且在该仓库中新建一个post-receive钩子文件。

1
2
3

cd ~
git init --bare hexo.git
vi ~/hexo.git/hooks/post-receive

输入以下内容：

1	git --work-tree=/wwwBlog --git-dir=/home/git/blog.git checkout -f

保存退出并授予该文件可执行权限，命令：

1	chmod +x ~/blog.git/hooks/post-receive

本地Hexo配置并发布

在本地计算机安装插件: hexo-deployer-git 和 hexo-server。这俩插件的作用分别是使用Git自动部署，和hexo本地简单的服务器。

1 2	npm install hexo-deployer-git --save npm install hexo-server

打开_config.yml文件，修改deploy项目如下：

deploy:
  type: git
  repo: git@云服务器公网IP:/home/git/blog.git
  branch: master

其中，type项表示部署类型为git，仓库repo地址为git@云服务器公网IP:/home/git/blog.git，分支branch为master主分支。

部署

1
2
3

hexo clean
hexo g
hexo d

此时博客页面已经推送到服务器的目录下/wwwBlog，部署完成后，若打开页面没变化，可以在云服务器输入以下重启nginx即可：nginx -s reload

参考链接

Win10环境下基于Hexo的静态博客环境搭建，及其阿里云部署

只需5步！在轻量应用服务器部署Hexo博客

这里有一个关于ssl证书的配置，留待以后
Hexo 博客搭建并发布到云服务器

张会挽's Blog

使用hexo搭建blog

简述