hexo迁移
总体思路
把hexo从windows迁移到archlinux下面
迁移的大致是在新系统里面安装git,配置ssh_key,安装nodejs,安装hexo,把原来的文件夹整体拷贝过来,在拷贝过来的根目录下面安装或者升级一下包 npm install
。然后测试一下
1 | hexo clean |
以下是博客搭建的全过程,为了统一说法,统一将云主机称为服务端,将本地电脑称为客户端。
本次搭建博客需要在客户端以及服务端进行一系列配置。先说一下整体的实现思路。总的来说分两大步。
第一步,在客户端进行以下工作:
- 安装Git服务以及配置Git
- 安装nodejs
- 安装Hexo框架
第二步,在服务端进行以下工作:
- 安装Nginx服务
- 安装Git服务以及nodejs
- 搭建Git服务器以及配置自动部署
客户端配置
安装git ,这个在arch安装的时候好像是安装了,或者
sudo pacman -S git
安装git。安装完成之后,打开
Git Bash
进行以下配置。(注:此处假定读者已经在github上注册了github账号。)
(1)、输入以下代码设置用户名和邮箱:1
2
3
4
5
6# 将此处的"yourname"替换成自己的用户名,配置git用户名
git config --global user.name "yourname"
# 将此处的"youremail"替换成自己的邮箱,配置邮箱
git config --global user.email "youremail"如下图:
(2)、输入以下代码进入.ssh目录检查是否有SSH Key
1
2cd ~/.ssh
ls我这里是的文件是直接从windows用户目录的.ssh文件夹拷贝过来的,拷贝过来需要注意更改一下
id_rsa
文件的权限,需要改成只能自己读。1
chmod 600 ~/.ssh/id_rsa
如果.ssh目录里面是空的就要新建SSH Key。
1
2# 将此处的"youremail"替换成自己的邮箱
ssh-keygen -t rsa -C "youremail"如下图:
接着继续输入cat ~/.ssh/id_rsa.pub
,然后将得到的秘钥先复制一下,待会服务器配置需要用到。
如下图:
安装Nodejs
我在arch是直接用的 sudo pacman -S nodejs
安装的,默认安装的是最新的版本,也可以 yay -S nvm
安装管理器,然后在管理器里面安装自己需要的nodejs版本。安装完成以后输入 node -v
npm -v
可以查看node以及npm的版本信息:
安装Hexo框架
这里可以全局或者局部安装到特定目录,我就直接按照hexo的官网全局安装了。
1 | npm install -g hexo-cli |
如下图:
安装完hexo框架,就可以开始初始化hexo了,选择一个目录存放你的博客文件,然后切换到那个目录。
接着,输入hexo init blog
进行初始化hexo。如下图:
初始化完成以后,安装hexo部署包
1 | npm install hexo-deployer-git --save |
安装完成以后打开博客根目录的 package.json
文件,应该可以在dependencies的配置中看到 hexo-deployer-git
这一项:
安装完包之后,接着在终端输入:hexo s
,启动本地服务,然后在浏览器输入localhost:4000
,就可以看到hexo已经搭建成功了。如下图:
至此,客户端的配置就告一段落了。接下来开始服务端的配置。
服务端配置
ssh 到服务器,windows下面使用 xshell ,finalshell ,或者putty, archlinux下面直接终端ssh到服务器,先更新系统
1 | sudo yum update |
更新完系统,输入以下代码,可查看系统版本:
1 | cat /etc/centos-release |
安装Nginx
EPEL 仓库中有 Nginx 的安装包。如果你还没有安装过 EPEL,可以通过运行下面的命令来完成安装:
1
sudo yum install epel-release
如果这是您第一次从 EPEL 仓库中安装软件,yum 可能会提示您导入 EPEL GPG key:
1
2
3
4
5
6
7Retrieving key from file:///etc/pki/rpm-gpg/RPM-GPG-KEY-EPEL-7
Importing GPG key 0x352C64E5:
Userid : "Fedora EPEL (7) <[email protected]>"
Fingerprint: 91e9 7d7c 4a5e 96f1 7f3e 888f 6a2f aea2 352c 64e5
Package : epel-release-7-9.noarch (@extras)
From : /etc/pki/rpm-gpg/RPM-GPG-KEY-EPEL-7
Is this ok [y/N]:类似于上面的内容,遇到这种情况,输入
y
,然后Enter(回车)
即可继续安装。输入以下命令来安装 Nginx:
1 | sudo yum install nginx |
- 等到安装完成以后,可以通过以下命令来设置开机启动和运行 Nginx 服务:
设置 Nginx 开机启动:
1 | sudo systemctl enable nginx |
运行以上命令以后,会输出类似以下的内容,表示创建了一个软连接来关联 Nginx,不用担心,并不是报错了,下一步就可以启动 Nginx 了。
1 | Created symlink from /etc/systemd/system/multi-user.target.wants/nginx.service to /usr/lib/systemd/system/nginx.service. |
启动 Nginx:
1 | sudo systemctl start nginx |
通过运行以下命令,来检查 Nginx 的运行状态:
1 | sudo systemctl status nginx |
然后会输出类型下面的内容
1 | ● nginx.service - The nginx HTTP and reverse proxy server |
- 如果你的服务器开启了防火墙,则需要同时打开 80(HTTP)和 443(HTTPS)端口
通过下面的命令来打开这两个端口:
1 | sudo firewall-cmd --permanent --zone=public --add-service=http |
国内的服务器厂商,安全组也可能会默认屏蔽这两个端口,比如 阿里云 和 腾讯云,如果在 第 5 步 时发现无法访问,可以自行谷歌一下如何放开这两个端口。
验证 Nginx 是否成功启动,可以在浏览器中打开
http://YOUR_IP
,您将看到默认的 Nginx 欢迎页面,类似于下图所示:配置Nginx
接下来,需要修改一下nginx的相关配置,包括设置网站根目录以及配置域名。输入以下代码,打开Nginx的配置文件。(注:此处假定读者已完成了域名备案以及域名解析。)配置Nginx
接下来,需要修改一下nginx的相关配置,包括设置网站根目录以及配置域名。输入以下代码,打开Nginx的配置文件。(注:此处假定读者已完成了域名备案以及域名解析。)1
vi /etc/nginx/conf.d/default.conf
依照下图进行修改,将“/usr/share/nginx/html”改为“/usr/share/nginx/html/blog”。
至此,Nginx的配置就基本完成了。下面的步骤是nginx管理相关,可以跳过。
通过 systemctl 管理 Nginx
你可以像管理其他服务那样管理 Nginx。
启动 Nginx
1
sudo systemctl start nginx
停止 Nginx
1
sudo systemctl stop nginx
重启 Nginx
1
sudo systemctl restart nginx
修改 Nginx 配置后,重新加载
1
sudo systemctl reload nginx
设置开机启动 Nginx
1
sudo systemctl enable nginx
关闭开机启动 Nginx
1
sudo systemctl disable nginx
Nginx 的配置文件和最佳实践
- 通过以上方式安装的 Nginx,所有相关的配置文件都在
/etc/nginx/
目录中。 - Nginx 的主配置文件是
/etc/nginx/nginx.conf
。 - 为了使 Nginx 配置更易于维护,建议为每个服务(域名)创建一个单独的配置文件。
- 每一个独立的 Nginx 服务配置文件都必须以
.conf
结尾,并存储在/etc/nginx/conf.d
目录中。您可以根据需求,创建任意多个独立的配置文件。 - 独立的配置文件,建议遵循以下命名约定,比如你的域名是
kaifazhinan.com
,那么你的配置文件的应该是这样的/etc/nginx/conf.d/kaifazhinan.com.conf
,如果你在一个服务器中部署多个服务,当然你也可以在文件名中加上 Nginx 转发的端口号,比如kaifazhinan.com.3000.conf
,这样做看起来会更加友好。 - 如果你的配置中有很多重复的代码,那么建议你创建一个
/etc/nginx/snippets
文件夹,在这里面存放所有会被复用的代码块,然后在各个需要用到的 Nginx 的配置文件中引用进去,这样可以更方便管理和修改。 - Nginx 日志文件(
access.log
和error.log
)位于/var/log/nginx/
目录中。建议为每个独立的服务配置不同的访问权限和错误日志文件,这样查找错误时,会更加方便快捷。 - 你可以将要部署的代码文件,存储在任何你想的位置,但是一般推荐存放在下列位置中的其中一个:
/home/<user_name>/<site_name>
/var/www/<site_name>
/var/www/html/<site_name>
/opt/<site_name>
/usr/share/nginx/html
服务器安装Nodejs
输入以下代码进行Nodejs的安装。或者自己安装 n 管理器来安装,参考 n
1
yum install nodejs
结果如下图:
- 通过以上方式安装的 Nginx,所有相关的配置文件都在
可输入node -v
以及npm -v
查看node的版本。尽量把服务器端和客户端的nodejs 版本保持一致,不然会导致莫名的错误。
至此,Nodejs的安装就完成了。
服务器安装Git以及进行相关配置
输入以下代码,进行Git的安装
1
yum install git
结果如下图:
创建git用户以及设置密码
输入以下代码:1
2
3
4
5#创建用户,用户名为git
adduser git
#设置密码
passwd git把git用户添加到sudo用户组中
输入以下代码sudo vi /etc/sudoers
,打开sudoers文件,输入:/root
进行搜索,搜索到代码行root ALL=(ALL) ALL
,然后在这一行下添加以下代码git ALL=(ALL) ALL
。输入完毕之后,按wq!
强制保存退出vi。
效果如下图:切换到git用户,添加SSH Key文件并且设置相应的读写与执行权限。
输入以下代码:1
2
3
4
5
6# 切换用户
su git
# 创建目录
mkdir ~/.ssh
# 新建文件
vim ~/.ssh/authorized_keys然后把之前在客户端设置的SSH Key,复制到authorized_keys文件中,保存后退出。如下图:
接下来设置文件权限,把authorized_keys文件设置成只有属主有读写权限,把ssh目录设置为只有属主有读、写、执行权限。代码如下:
1
2chmod 600 ~/.ssh/authorized_keys
chmod 700 ~/.ssh设置完后,返回客户端,打开终端,输入以下代码,测试是否能连接上服务器:
1
2# ServerIP为你自己服务器的ip
ssh -v git@ServerIP结果如下图:
重新回到服务器,在网站根目录新建一个blog文件夹,用于客户端上传文件,并且把该文件授权给git用户。代码如下:
1
2
3# 使用sudo指令,需要输入git用户的密码
sudo mkdir -p /usr/share/nginx/html/blog
sudo chown -R git:git /usr/share/nginx/html/blog在服务器上初始化一个git裸库
切换到git用户,然后切换到git用户目录,接着初始化裸库,代码如下:1
2
3su git
cd ~
git init --bare blog.git接着新建一个post-receive文件
1
vim ~/blog.git/hooks/post-receive
然后在该文件中输入以下内容:
1
2#!/bin/sh
git --work-tree=/usr/share/nginx/html/blog --git-dir=/home/git/blog.git checkout -f保存退出之后,再输入以下代码,赋予该文件可执行权限。
1
chmod +x ~/blog.git/hooks/post-receive
如下图:
返回客户端,设置博客根目录下的_config.yml文件。
1
2
3
4
5deploy:
type: git
repo: git@SERVER:/home/git/blog.git #此处的SERVER需改为你自己服务器的ip
branch: master #这里填写分支
message: #提交的信息如图:
保存后,在博客根目录打开Git Bash,输入以下命令:
1
2
3hexo clean
hexo g
hexo d部署完毕之后,即可在浏览器输入你的服务器ip进行访问你的博客了。
主题安装
这是我喜欢的一个主题,hexo 5 下面 hexo 会报错,不过也可以用。参考 hexo-theme-Wikitten
安装和配置。
typora插入图片设置
参考这个 hexo和typora图片无法正常显示解决方案 感觉这个配合typora 比较顺手。
设置typora
依次点击:文件-》偏好设置-》图像,进行如下设置:
修改hexo配置文件并安装插件
- 修改_config.yml文件:
post_asset_folder: true
npm install hexo-image-link --save
安装插件
- 修改_config.yml文件:
新建一篇博客进行测试
hexo new "test"
新建test.md文件,此时会再同级目录下新建test文件夹。用typora编辑test.md文件,随便拷贝一张图片
head.jpg
粘贴到typora中。此时图片会自动拷贝到test文件夹。检查粘贴后的文件路径是否为
test/head.jpg
,如果不是请回第一步设置好typora。hexo s
进行测试,查看hexo是否正常显示图片。大功告成
archlinux下Hexo博客新建文章后自动打开编辑器
参考 https://github.com/hexojs/hexo/issues/1007
1
2
3
4
5
6
7
8
9
10
11
12
13You can try to listen to the new event. For example:
var spawn = require('child_process').spawn;
// Hexo 2.x
hexo.on('new', function(path){
spawn('vi', [path]);
});
// Hexo 3
hexo.on('new', function(data){
spawn('vi', [data.path]);
});进入到hexo 根目录,看看是否有
scripts
文件夹,如果没有就新建。1
2
3
4
5
6
7
8
9
10
11mkdir scripts
# 创建文件夹
vim AutoOpenEditor.js
# 创建js文件
# typora& 让typora后台运行,终端按下Ctrl + C 后typora不会退出
var spawn = require('child_process').spawn;
// Hexo 3
hexo.on('new', function(data){
spawn('typora&', [data.path]);
});