搭建Hexo静态博客并部署到服务器

博客搭建9 分钟读完 (大约1423个字)0次访问

前言

记录Hexo博客搭建的基本过程，包括备份到GitHub以及部署到服务器。

准备工作

  • 安装git

    到git官网下载安装包，可根据自己的系统(Mac/Linux/Win)进行选择，下载完进行安装即可。

  • 安装node.js

    同样到node.js官网下载对应的安装包，一直下一步安装。

  • 测试安装结果

    1
    2
    3
    4
    5
    6
    git --version
    //查看git版本
    node --version
    //查看node.js版本
    npm --version
    //查看npm版本

    能够看到版本号，则说明安装成功

安装Hexo

  • 使用npm命令安装Hexo

    1
    2
    npm install -g hexo-cli
    //使用-g命令进行全局安装

    安装过程视网络情况而定，如果安装速度过慢，可以使用cnpm进行安装，安装完毕后如下，可能会出现一些警告信息，可以忽略

  • 查看hexo是否安装成功

    1
    2
    hexo -v
    //查看hexo版本号

    运行上述代码后，出现错误提示hexo : 无法加载文件 ……\npm\hexo.ps1，因为在此系统上禁止运行脚本

    解决方案：

    1
    2
    //在Powershell中运行如下代码
    set-ExecutionPolicy RemoteSigned

    执行完毕后，就可以看到hexo的版本了，说明hexo已经安装成功

使用Hexo在本地部署博客

  • 首先新建一个空白的文件夹，并使用hexo进行初始化

    1
    2
    3
    4
    5
    6
    mkdir blog
    //创建一个文件夹
    cd .\blog\
    //进入blog文件夹
    hexo init
    //进行初始化

    注意：使用hexo进行初始化时，必须保证文件夹是空的，否则会报错

  • 在同样的文件夹下，运行命令生成文件，并开启hexo服务

    1
    2
    3
    4
    5
    6
    hexo clean
    //清理原来生成的配置文件(如果有的话)
    hexo g
    //生成配置文件
    hexo s
    //启动本地的hexo服务

    启动服务后如下，这个界面是因为我更换了icarus的主题，没有更换主题的界面和下图不同

    注意：生成和推送博客上，可能会提示Package cheerio is not installed，只需要执行npm install cherrio -S即可

    运行hexo后，根据提示进入localhost:4000，就可以看到生成的博客了

将博客备份到GitHub

  • 创建GitHub仓库

    作为备份，我们可以在GitHub创建一个仓库来进行存放。首先进入Github，点击右上角的账户→Your repositories→New，创建一个新的仓库，类型根据自己需求选择public或者private

  • 配置秘钥

    1
    2
    3
    4
    5
    6
    git config --global user.name "Name"
    //Name为Github用户名
    git config --global user.email "Email@domain.com"
    //Email为GitHub邮箱
    ssh-keygen -t rsa -C "Email@domain.com"
    //生成秘钥

    秘钥生成后，到C:\User\Username\\.ssh下，打开id_rsa.pub文件，复制秘钥

    打开GitHub，进入右上角用户→Settings→SSH and GPG keys→New ssh key，新建一个SSH秘钥，将刚才复制的内容粘贴进去，并确认

    确认完毕后，运行ssh -T git@github.com测试秘钥是否可用，连接成功后如下

  • 提交到GitHub

    要提交内容到GitHub，可以使用hexo的deploy功能

    1
    2
    npm install hexo-deploy-git --save
    //安装hexo-deplyo-git插件

    安装完毕后，进入博客目录，编辑_config.yml文件，在末尾的deploy功能中，填上GitHub仓库的地址即可

    接下来，运行hexo deploy，即可将博客上传到GitHub仓库中

将博客部署到服务器

  • 配置服务器git账户

    安装git并创建git账户

    1
    2
    3
    4
    5
    6
    7
    8
    9
    //安装git
    sudo apt-get update
    sudo apt-get install git
    //配置单独的git用户用于同步博客
    adduser git //添加用户，并根据提示设置密码
    //给git账户添加权限
    vim /etc/sudoers
    //在root用户下方添加
    git    ALL=(ALL)    ALL

    切换到git用户，初始化git仓库

    1
    2
    3
    4
    5
    6
    7
    8
    //切换目录
    cd /home/git
    //创建git仓库文件夹
    mkdir blog.git
    //进入仓库目录
    cd blog.git
    //初始化为空仓库
    git init --bare

    配置SSH秘钥

    1
    2
    3
    4
    5
    6
    7
    su git
    mkdir ~/.ssh
    //将Windows下生成的秘钥拷贝过来
    vim ~/.ssh/authorized_keys
    //修改文件权限
    chmod 600 ~/.ssh/authorized_keys
    chmod 700 ~/.ssh

    配置完毕后，回到Windows输入ssh -v git@Server测试秘钥是否可用

  • 安装Nginx

    1
    sudo apt-get install nginx

    安装完毕后，执行sudo /etc/init.d/nginx start，若显示running则表示安装成功

  • 配置Nginx

    打开配置文件

    1
    2
    cd /etc/nginx/conf.d/
    sudo vim blog.conf

    添加如下配置，并根据监听端口，开启服务器防火墙

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    server{
            listen 8081;
            server_name _;
            root /var/www/blog;
            index index.html;
            location / {

            }
    }

    配置博客根目录

    1
    mkdir /var/www/blog

    确保blog.git、.ssh、blog目录的用户组权限均为git:git，如下图所示

    如果不是，则执行如下命令，修改权限

    1
    2
    sudo chown git:git -R /var/www/blog
    sudo chown git:git -R /home/git/blog.git

  • 配置Git Hooks

    创建post-receive文件

    1
    2
    3
    4
    5
    6
    su git
    //切换用户
    cd /home/git/blog.git/hooks
    //进入hooks目录
    vim post-receive
    //创建文件

    添加如下内容

    1
    2
    3
    4
    5
    6
    7
    8
    #!/bin/bash
    GIT_REPO=/home/git/blog.git
    TMP_GIT_CLONE=/tmp/blog
    PUBLIC_WWW=/var/www/blog
    rm -rf ${TMP_GIT_CLONE}
    git clone $GIT_REPO $TMP_GIT_CLONE
    rm -rf ${PUBLIC_WWW}/*
    cp -rf ${TMP_GIT_CLONE}/* ${PUBLIC_WWW}

    保存后，执行：chmod +x post-receive 添加权限

  • 配置Hexo

    编辑本地博客根目录下的_config.yml文件，在原来备份到GitHub的地址下添加一行Server: git@YourIP:blog.gt，再运行hexo deploy就可以将博客部署到服务器上了

搭建Hexo静态博客并部署到服务器

http://yoursite.com/2020/03/01/搭建Hexo静态博客并部署到服务器/

作者

OKC

发布于

2020-03-01

更新于

2021-03-29

许可协议

喜欢这篇文章？打赏一下作者吧

评论

目录

×