Hexo博客搭建步骤

2023-08-23 17:22:06 浏览数 (1)

以Mac系统安装为例，其它Windows、Linux系统安装都是大同小异。

1、下载安装nodejs

下载地址：https://nodejs.org/zh-cn/ ，选长期支持版本进行下载安装。

node -v命令验证是否安装成功。

代码语言：javascript复制
zhaoxb:hexo_blog zhaoxiaobin$ node -v
v12.19.0

2、安装淘宝镜像cnpm

npm install -g cnpm --registry=https://registry.npm.taobao.org

cnpm -v命令验证是否安装成功。

代码语言：javascript复制
zhaoxb:hexo_blog zhaoxiaobin$ cnpm -v
cnpm@6.1.1 (/usr/local/lib/node_modules/cnpm/lib/parse_argv.js)
npm@6.14.8 (/usr/local/lib/node_modules/cnpm/node_modules/npm/lib/npm.js)
node@12.19.0 (/usr/local/bin/node)
npminstall@3.27.0 (/usr/local/lib/node_modules/cnpm/node_modules/npminstall/lib/index.js)
prefix=/usr/local 
darwin x64 19.4.0 
registry=https://r.npm.taobao.org

安装这个主要是为了后面安装插件能够加快下载速度。

3、安装hexo

cnpm install -g hexo-cli

hexo -v命令验证是否安装成功。

代码语言：javascript复制
zhaoxb:hexo_blog zhaoxiaobin$ hexo -v
hexo: 5.2.0
hexo-cli: 4.2.0
os: Darwin 19.4.0 darwin x64
node: 12.19.0
v8: 7.8.279.23-node.44
uv: 1.39.0
zlib: 1.2.11
brotli: 1.0.9
ares: 1.16.0
modules: 72
nghttp2: 1.41.0
napi: 7
llhttp: 2.1.2
http_parser: 2.9.3
openssl: 1.1.1g
cldr: 37.0
icu: 67.1
tz: 2019c
unicode: 13.0

4、创建博客目录并初始化

选择在自己喜欢的目录下创建博客目录作为workspace

代码语言：javascript复制
mkdir hexo_blog
cd hexo_blog
hexo init

博客文章所在目录为source/_posts，默认会有一篇Hexo的介绍文档。

在这个目录下可以新建markdown格式的文件来创建一篇博客文章，会被转成html页面来进行展示。

当然也可以在博客目录hexo_blog下使用hexo n xxx命令来创建一篇文章，最后效果也是在source/_posts目录下生成一个名为xxx.md的文件。

代码语言：javascript复制
hexo n xxx

5、启动查看效果

hexo s命令启动服务，根据提示，浏览器打开http://localhost:4000/访问可以看到初始化的博客页面。

6、github创建repositroy

这里使用github pages功能，托管静态代码来做个人主页，仓库名称必须为 username.github.io，比如我的是senlinmu1008.github.io。仓库最好选择公开，以免影响访问。

当然这里并非一定要使用github，也可以使用国内的gitee pages或者coding也有托管个人博客的功能，只不过我个人使用下来还是github最好用最靠谱，只不过访问速度可能有点慢，可以用CDN加速来解决。

7、安装部署插件

进入到博客目录下执行安装插件。

代码语言：javascript复制
cd hexo_blog
cnpm install --save hexo-deployer-git

这个插件可以把生成的页面通过git推送到github仓库中，当然前提是你已经安装好了git工具。

8、添加_config.yml文件的部署地址

代码语言：javascript复制
# Deployment
## Docs: https://hexo.io/docs/one-command-deployment
deploy:
  type: git
  repo: https://github.com/senlinmu1008/senlinmu1008.github.io.git
  branch: master

这里仓库地址repo填成实际个人的，就是git clone下代码的那个地址，可以用https也可以是SSH。

当然这里也可以使用gitee或者coding的仓库，也可以同时配置多个，比如：

代码语言：javascript复制
# Deployment
## Docs: https://hexo.io/docs/one-command-deployment
deploy:
  type: git
  repo:
    github: git@github.com:senlinmu1008/senlinmu1008.github.io.git
    gitee: git@gitee.com:ppbin/ppbin.git
    coding: git@e.coding.net:zhaoxiaobin/blog/blog.git
  branch: master

上面用的是SSH方式，好处就是配置了SSH keys以后都不用再输账号密码了。

9、部署

分别执行hexo g、hexo deploy命令进行页面生成和远程部署。

代码语言：javascript复制
hexo g
代码语言：javascript复制
hexo deploy

如果是第一次推送到github，这里可能会提示输入仓库的账号密码，如果配置了SSH keys则不需要输入。

10、查看效果

浏览器输入域名个人的username.github.io，比如senlinmu1008.github.io，不出意外的话，就可以看到当前个人博客的初始页面效果。

到这一步其实个人博客已经搭建完成，当然个性化的配置以及自定义域名这些都是后续看个人喜好和需要了。

11、更换主题

可以在网上搜一些Hexo的主题，选择一个自己喜欢的，下载到themes目录下，然后修改_config.yml配置文件。

代码语言：javascript复制
# Extensions
## Plugins: https://hexo.io/plugins/
## Themes: https://hexo.io/themes/
theme: butterfly

修改为自己下载的主题名称。比如这里我个人用的是butterfly主题。如果对个性化配置要求比较高，可以学习下怎么配置主题，一般常用主题都会有详细而全面的教程来指导如何使用。

11.1、更新主题

如果后续主题升级了需要更新，可以使用以下步骤（需要切换到主题所在的目录中）：

代码语言：javascript复制
# 将当前主题修改的内容增加到工作区
git add .
# 个人修改的暂存本地并还原已修改的文件
git stash
# 执行更新主题
git pull
# 恢复个人修改的文件内容，可能需要合并
git stash pop

12、常用命令

一般Hexo的命令都要在博客所在目录即之前创建的workspace目录下执行才有效。

命令

功能

hexo clean

清除所有生成的页面文件

hexo g

生成页面

hexo deploy

推送部署到远程服务器

hexo n xxx

新建一篇名为xxx的文章

hexo 博客 博客搭建 部署 配置

0 人点赞