基于Node.js搭建hexo博客过程详解


Posted in Javascript onJune 25, 2019

一、安装新版本的nodejs和npm

安装n模块:

npm install -g n

升级node.js到最新稳定版

n stable

二、安装hexo

note: 参考github,不要去其官网

安装Hexo

npm install hexo-cli -g

Setup your blog

hexo init blemesh
cd blemesh

安装Cactus主题,众多开源主题中比较简洁的一个:

主题页

Cactus页

git clone https://github.com/probberechts/hexo-theme-cactus.git themes/cactus

修改主题配置:

vim _config.yml

# Extensions
## Plugins: https://hexo.io/plugins/
## Themes: https://hexo.io/themes/
## theme: landscape
theme: cactus
theme_config:
colorscheme: white

Create pages and articles with the hexo new [layout] <title> command. For example, to create an "about me" page, run:

hexo new page about

This will create a new file in source/about/index.md Similary, you can create a new article with

hexo new post "hello world"

and add some interesting content in source/_posts/hello-world.md.

Start the server:

hexo server

8001 port:

hexo server -p 8001

三、安装hexo-admin并配置

安装:

npm install --save hexo-admin

打开目录下的_config.yml配置hexo-admin:

admin:

username: XXXX(自己设置用户名)
password_hash: XXXXXXXXX(密码,但是是明文经过bcrypt hash加密后生成的)
secret: hey hexo(用于cookie安全)
deployCommand: './admin_script/hexo-generate.sh'(调用该脚本)

注:

1)其中password_hash是你自己的明文密码经过加密后的字符串,但是如果用类似下面的网址: https://bcrypt-generator.com/ 会生成:$2y$10$pJjIxxxxxfMn9U/xxxxxNuuA20kh1eoB7vZxxxxx/7WpeV7IOxxxx类似的加密串,但是运行会报invalid salt revision错误,其原因是:

➜ blemesh cat node_modules/hexo-admin/www/bundle.js | head -4851 | tail -10
if (salt.charAt(0) != '$' || salt.charAt(1) != '2')
throw "Invalid salt version";
if (salt.charAt(2) == '$')
off = 3;
else {
minor = salt.charAt(2);
if (minor != 'a' || salt.charAt(3) != '$')
throw "Invalid salt revision";
off = 4;
}

需要版本号是2a的加密方式,因此只能用python自己写了:

https://pypi.org/project/bcrypt/3.1.0/

>>> hashed = bcrypt.hashpw(password, bcrypt.gensalt(prefix=b"2a"))
>>> print(hashed)
b'$2a$12$PAoJr3USOBxxxxxxxxxxxxxxV/.h.QNbh/6q.xxxxxxxxxxxxxxxxcDcJ.'

2)其中配置中有个脚本: ./admin_script/hexo-generate.sh 需要自己创建:

➜ blemesh cat admin_script/hexo-generate.sh 
hexo g
➜ blemesh chmod +x admin_script/hexo-generate.sh

这个脚本有什么用,啥时候触发?可以参考: https://www.jianshu.com/p/68e727dda16d step 5,admin后台管理博客有个deploy按钮,点击这个按钮就会执行这个脚本,该脚本会将md文件生成静态网页,如果用nginx配置去访问静态网页,速度会快很多。

四、nginx配置

配置nginx:编辑 /etc/nginx/nginx.conf 插入下面代码:

server {
listen 3001;
server_name www.beautifulzzzz.com;
index index.html index.htm index;
root /root/App/blemesh/public; 
}

之后重启nginx:nginx -s reload

注:
执行nginx后会报错误:nginx 403 Forbidden,原因是配置文件nginx.conf文件的执行用户和当前用户不一致导致的,把之前的nobody改成当前用户root。

五、增加tag

hexo主页下的tag标签、category标签无显示找不到:

解决办法: 在主目录下执行 hexo new page "tags"或者hexo new page "category"
在/source/tags/index.md中设置修改

➜ blemesh cat ./source/tags/index.md 
---
type: "tags"
comments: false
date: 2019-02-24 02:53:03
---

同理categories:

➜ blemesh cat ./source/category/index.md 
---
type: "category"
comments: false
date: 2019-02-24 02:53:34
---

或者about me:

➜ blemesh cat ./source/about/index.md 
---
title: about
type: "about-me"
comments: false
date: 2019-02-22 00:09:58
---

六、后台启动

hexo server进程一直在后台运行的办法(执行hexo server -d &在一段时间后会停止hexo,此时无法打开后台),采用pm2接管hexo进程:

npm install -g pm2

在博客的根目录下创建一个hexo_run.js的文件,文件内容如下:

➜ blemesh cat hexo_run.js 
const { exec } = require('child_process')
exec('hexo server -p 8001 -d',(error, stdout, stderr) => {
if(error){
console.log('exec error: ${error}')
return
}
console.log('stdout: ${stdout}');
console.log('stderr: ${stderr}');
})

运行开启命令: pm2 start hexo_run.js

最后附上 zhouwaiqiang 写的一个hexo重启脚本restart_hexo.sh(需要先配置好nginx),需要重启刷新的时候执行source restart_hexo.sh即可:

➜ blemesh cat restart_hexo.sh 
#!/bin/bash
PROCESS=`ps -ef|grep hexo|grep -v grep|grep -v PPID|awk '{ print $2 }'`
PROC_NAME="pm2"
for i in $PROCESS
do
echo "Kill the $1 process [ $i ]"
kill -9 $i
done
hexo clean #清除数据
hexo generate #生成静态文件public文件夹
ProcNumber=`ps -ef |grep -w $PROC_NAME|grep -v grep|wc -l`
if [ $ProcNumber -le 0 ];then
pm2 start hexo_run.js
else
pm2 restart hexo_run.js
fi
service nginx restart

七、体验

  • 启动:sh ./restart_hexo.sh
  • 访问主页: http://www.beautifulzzzz.com:8001/
  • 访问nginx静态快速版网页: http://www.beautifulzzzz.com:3001/
  • 访问后台编写文章: http://www.beautifulzzzz.com:8001/admin/
  • 编写好之后点击Deploy会自动调用之前的脚本,静态网页就有了

基于Node.js搭建hexo博客过程详解

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
JavaScript中的Document文档对象
Jan 16 Javascript
Javascript处理DOM元素事件实现代码
May 23 Javascript
js给onclick事件赋值,动态传参数实例解说
Mar 28 Javascript
当某个文本框成为焦点时即清除文本框内容
Apr 28 Javascript
Javascript实现的简单右键菜单类
Sep 23 Javascript
Fullpage.js固定导航栏-实现定位导航栏
Mar 17 Javascript
JS中使用FormData上传文件、图片的方法
Aug 07 Javascript
浅谈js继承的实现及公有、私有、静态方法的书写
Oct 28 Javascript
jQuery实现自动调用和触发某个事件的方法
Nov 18 Javascript
jQuery实现获取隐藏div高度的方法示例
Feb 09 Javascript
jQuery实现的手动拖动控制进度条效果示例【测试可用】
Apr 18 jQuery
微信小程序背景音乐开发详解
Dec 12 Javascript
Node.js实现简单的爬取的示例代码
Jun 25 #Javascript
浅谈目前可以使用ES10的5个新特性
Jun 25 #Javascript
vue 移动端注入骨架屏的配置方法
Jun 25 #Javascript
基于vue+axios+lrz.js微信端图片压缩上传方法
Jun 25 #Javascript
新手快速入门微信小程序组件库 iView Weapp
Jun 24 #Javascript
前端Vue项目详解--初始化及导航栏
Jun 24 #Javascript
微信小程序调用天气接口并且渲染在页面过程详解
Jun 24 #Javascript
You might like
Codeigniter出现错误提示Error with CACHE directory的解决方案
2014/06/12 PHP
php根据某字段对多维数组进行排序的方法
2015/03/07 PHP
thinkPHP实现的联动菜单功能详解
2017/05/05 PHP
PHP中-&gt;和=&gt;的含义及使用示例解析
2020/08/06 PHP
js实现的网站首页随机公告随机公告
2007/03/14 Javascript
asp.net HttpHandler实现图片防盗链
2009/11/09 Javascript
优化javascript的执行效率一些方法总结
2013/12/25 Javascript
JS中多种方式创建对象详解
2016/03/22 Javascript
Json对象和字符串互相转换json数据拼接和JSON使用方式详细介绍(小结)
2016/10/25 Javascript
详解JSON1:使用TSQL查询数据和更新JSON数据
2016/11/21 Javascript
微信小程序 实现点击添加移除class
2017/06/12 Javascript
浅谈JavaScript的innerWidth与innerHeight
2017/10/12 Javascript
angular2路由之routerLinkActive指令【推荐】
2018/05/30 Javascript
原生JS实现图片懒加载之页面性能优化
2019/04/26 Javascript
通过jQuery学习js类型判断的技巧
2019/05/27 jQuery
js实现GIF动图分解成多帧图片上传
2019/10/24 Javascript
Vue将props值实时传递 并可修改的操作
2020/08/09 Javascript
使用js原生实现年份轮播选择效果实例
2021/01/12 Javascript
python3 实现口罩抽签的功能
2020/03/11 Python
Pycharm快捷键配置详细整理
2020/10/13 Python
python 实现性别识别
2020/11/21 Python
新西兰演唱会和体育门票网站:Ticketmaster新西兰
2017/10/07 全球购物
私有程序集与共享程序集有什么区别
2013/04/05 面试题
护理专科毕业生自荐书范文
2014/02/19 职场文书
房产继承公证书
2014/04/09 职场文书
小学校长先进事迹材料
2014/05/13 职场文书
关于感恩的演讲稿200字
2014/08/26 职场文书
2015年中秋节活动总结
2015/03/23 职场文书
停水通知
2015/04/16 职场文书
党校培训学习心得体会
2016/01/06 职场文书
2016国庆促销广告语
2016/01/28 职场文书
基于PyTorch实现一个简单的CNN图像分类器
2021/05/29 Python
Python pandas读取CSV文件的注意事项(适合新手)
2021/06/20 Python
如何优化vue打包文件过大
2022/04/13 Vue.js
Redis实现主从复制方式(Master&Slave)
2022/06/21 Redis
JavaScript实现音乐播放器
2022/08/14 Javascript