
【hexo搭建】教你如何在阿里云服务器上搭建部署hexo静态博客+shoka主题
关于B站小伙伴问的很多问题,我觉得博客上面的教程应该整理一下,免得有些想要搭建hexo框架的小伙伴继续踩坑,这次的教程非常的详细,只要按照步骤一步步来,你的博客肯定能搭建起来,也是B站很多小伙伴和我一起测试过没问题以后才发出来的,教程分为三个部分 。
本地hexo博客搭建
阿里云服务器上hexo的搭建以及将本地部署上去。
主题shoka的安装。
(hexo搭建原理图)
本地hexo静态博客搭建
个人使用的环境, 需要一个本地环境:Windows10(64位)电脑一台, 云主机:阿里云ECS(CentOS 8 64位),这里不一定跟我系统一样也能搭建成功,KK用的基本最新的系统。
整个部署过程 ,本地环境搭建(Git,NodeJs,Hexo) 云主机环境搭建(Git,宝塔面板一键部署Nginx) 使用git自动化部署博客 。
本地Win10搭建环境
安装Git,百度git,然后下载安装包(打开后一直下一步到结束就行),同样 百度Node js 安装Node js(下载安装包,打开后一直下一步到结束就行) 。
接下来安装hexo
我部署在D:/blog 中,你根据自己的习惯定义部署位置,不建议C盘,避免系统损坏后导致文件丢失。打开D盘,新建blog文件夹,打开blog文件夹,右键git bush here”。执行如下命令.
npm install hexo-cli -g
hexo init
npm install hexo server
npm install hexo-deployer-git --save
定义邮箱(更换为你的邮箱地址就行)
git config --global user.email "xiaomichennian@163.com"
定义名称(更换自定义一个名称就行)
git config --global user.name "mingKK"
测试本地部署
hexo g -d
hexo s
然后会出现一个本地地址localhost:4000博客地址打开看看是否搭建成功。
生成ssh 公钥
在Win10桌面右击,点击Git Bash Here打开命令行终端,执行如下命令(直接按三次回车生成密钥)
ssh-keygen -t rsa
生成的文件默认在~/.ssh目录中,看到有id_rsa,id_rsa.pub这些文件即可, Win10中就是 我的电脑/C盘/用户/你自己的用户名/.shh/ 就可以看到了,别问为啥,后期我们会用到。
配置_config.yml,完成自动化部署为服务器上搭建做本地准备
打开D盘,blog文件夹,打开blog文件夹,打开_config.yml, 找到deploy
deploy:
type:git
repo: git@server:/var/repo/hexoBlog.git
branch: master
#server改为你的服务IP地址或解析后的域名
#例如我改为repo: git@mkk.quefeixi.com:/var/repo/hexoBlog.git
(特别提醒:后期主题有个复制替换_config.yml的步骤记得把这里改过来。否则连接不了服务器。)
至此本地搭建已经结束了。
阿里云服务器上hexo的搭建及本地部署到服务器仓库
宝塔面板安装
为了适合小白安装部署和后期网站服务器的扩展性,选用宝塔面板来一键部署Nginx Linux面板6.0安装命令(暂时仅兼容Centos7.x,其它系统版本请安装5.9稳定版)
yum install -y wget && wget -O install.sh http://download.bt.cn/install/install_6.0.sh && bash install.sh
安装完成后我们顺便把配置文件也弄好,后期就不需要弄了,安装完成后会显示面板后台地址·账号·密码。打开面板后台地址登陆面板,选择Nginx的部署方案,静静等待部署。部署完成,点击网站-添加站点-输入域名(没有域名的输入自己的IP地址)-底部的PHP版本选择”纯静态”(其他不改 或者根据自己的习惯来改)-提交。网站创建完成后点击设置-配置文件。
server
{
listen 80;
\# server_name 填写自己的域名
server_name mkk.quefeixi.com;
index index.php index.html index.htm default.php default.htm default.html;
\# 这里root填写自己的网站根目录,修改为/var/www/hexo
root /var/www/hexo;
保存
点击设置-网站目录,修改为/var/www/hexo ,保存.
阿里云服务器部署仓库
安装git
yum install git
创建Git账户
adduser git
添加账户权限
chmod 740 /etc/sudoers
vim /etc/sudoers
找到
Allow root to run any commands anywhere
root ALL=(ALL) ALL
添加以下内容、
git ALL=(ALL) ALL
保存退出(按 Esc 键退出编辑模式,输入”:wq” 保存退出)并改回权限。
chmod 400 /etc/sudoers
设置git账户密码
sudo passwd git
切换至git用户,创建 ~/.ssh 文件夹和 ~/.ssh/authorized_keys 文件,并赋予相应的权限
su git
mkdir ~/.ssh
vim ~/.ssh/authorized_keys
然后将前面win10中生成的id_rsa.pub文件中的公钥复制到authorized_keys
chmod 600 /home/git/.ssh/authorzied_keys
chmod 700 /home/git/.ssh
在本地Git终端中测试是否能免密登录git,其中下面SERVER为填写自己的云主机IP一定替换过来,执行输入yes后不用密码就说明好了(KK这里没有免密成功但是不影响使用,你如果也没有可以放弃直接下一步步骤,反正我这边暂时找不到原因放弃了只是后期需要输入密码,不过还行也就1秒钟的事情,嫌麻烦的可以自己想办法解决一下)。
ssh -v git@SERVER
创建目录
repo作为为Git仓库目录
mkdir /var/repo
chown -R git:git /var/repo
chmod -R 755 /var/repo
hexo作为网站根目录
mkdir /var/www
mkdir /var/www/hexo
chown -R git:git /var/www/hexo
chmod -R 755 /var/www/hexo
然后创建一个裸的 Git 仓库,返回root目录创建。
su root
cd /var/repo
git init --bare hexoBlog.git
创建一个新的 Git 钩子,用于自动部署 在 /var/repo/hexoBlog.git 下,有一个自动生成的 hooks 文件夹。我们需要在里边新建一个新的钩子文件 post-receive。
vim /var/repo/hexoBlog.git/hooks/post-receive
按 i 键进入文件的编辑模式,在该文件中添加两行代码(将下边的代码粘贴进去),指定 Git 的工作树(源代码)和 Git 目录(配置文件等)
# !/bin/bash
git --work-tree=/var/www/hexo --git-dir=/var/repo/hexoBlog.git checkout -f
然后,按 Esc 键退出编辑模式,输入”:wq” 保存退出。
修改文件权限,使得其可执行。
chown -R git:git /var/repo/hexoBlog.git/hooks/post-receive
chmod +x /var/repo/hexoBlog.git/hooks/post-receive
到这里,我们的 Git 仓库算是完全搭建好了
重启宝塔面板服务
service bt restart
不出错显绿说明完成,
然后到本地
hexo clean
hexo g -d
打开浏览器输入你的域名或ip地址就可以看到你部署的Hexo博客了。至此,我们已经成功完成,并且访问自己的服务器端比访问github快多了.
常见问题
我在部署过程中,执行 hexo d发现部署老是出错,什么权限不允许之类的,这里我们需要检查我们在上述的git操作部署是否使用了git用户操作,若是没有,需要给相应的目录更改用户组 使用.
比如:
chown -R git:git /var/repo/
这条命令递归的将repo目录及其子目录用户组设置为git。同时使用
chown -R git:git /var/www/hexo
这样即可解决此类问题。
主题shoka的安装和美化
1.安装
git clone https://gitee.com/mingkaikai/hexo-theme-shoka.git ./themes/shoka
这里我没有用作者的镜像因为github是国外的太慢了。
打开主题目录,内有 example 文件夹,将里面的_config.yml 复制替换根目录_config.yml这样少了一步配置搭建为了节省时间.
然后_config.yml 修改好你的仓库地址和服务器别忘了 具体在前面搭建时候已经弄过并且提醒了复制过来保存就行。
在应用主题之前,必须至少安装 hexo-renderer-multi-markdown-it 渲染插件 和 hexo-autoprefixer。
2.multi-markdown-it 安装与配置
安装前,记得务必卸载掉默认的 hexo-renderer-marked ,以及别的 markdown 文件渲染器。
npm un hexo-renderer-marked --save
安装
npm i hexo-renderer-multi-markdown-it --save
如果安装缓慢,或者失败如报错,请使用下面这条命令。
npm i hexo-renderer-multi-markdown-it --save --ignore-scripts
现在可以部署到网站了
hexo clean
hexo g-d
最后出现报错
npm uninstall js-yaml
npm install js-yaml@3.14.1
输入上面命令修改一下版本即可
hexo g-d
至此我们整个搭建过程就结束,感谢大家的支持
宝塔设置/var/www/hexo目录显示请不要将网站根目录设置到以下关键目录中,怎么搞
老哥 hexo d的时候
[new branch] HEAD -> mainTo 120.25.84.254:/var/repo/hexoBlog.git
Branch 'master' set up to track remote branch 'main' from 'root@120.25.84.254:/v
ar/repo/hexoBlog.git'.
把master换成main 网页也没有 咋整
老哥,你好,我部署时也遇到和你同样的情况,请问你解决了吗?已经困恼很久了。
最近没搭建过 可能又改了
hexo d 的时候 报错
remote: error: cannot run hooks/post-receive: No such file or directry
To 120.46.188.164:/www/wwwroot/hexo/hexo.git
94f3eab..4bbd16f HEAD -> master
branch 'master' set up to track 'git@120.46.188.164:/www/wwwroot/hex/hexo.git/master'.
master换成main应该就可以了
不错不错
谢谢!