在Debian10上配置Hexo+Github做个人博客

发表于 2020-12-19 更新于 2022-11-11 分类于软件应用， Linux ， Hexo ， Next主题阅读次数： Waline：阅读次数：本文字数： 10k 阅读时长 ≈ 21 分钟

在debian10上配置Hexo+Github做个人博客及导出wordpress文章到博客方法介绍

在Debian10上配置Hexo+Github做个人博客

一、`nvm`安装`node`

安装`nvm`

命令：
cURL:

1	$ curl https://raw.github.com/creationix/nvm/master/install.sh \| sh

或者wget:

1	wget -qO- https://raw.github.com/creationix/nvm/master/install.sh \| sh

解决`nvm`安装成功后，但命令不可用(`command not found`)

运行以下命令

1	vim ~/.bashrc

~~输入以下内容~~：

1 2	export NVM_DIR="$HOME/.nvm"~~ [ -s "$NVM_DIR/nvm.sh" ] && \. "$NVM_DIR/nvm.sh"

1
2
3

export NVM_DIR="$HOME/.nvm"
[ -s "$NVM_DIR/nvm.sh" ] && \. "$NVM_DIR/nvm.sh"  # This loads nvm
[ -s "$NVM_DIR/bash_completion" ] && \. "$NVM_DIR/bash_completion"  # This loads nvm bash_completion

~~查看输入内容：~~

1
2
3

user@user-pc:~/.nvm$ cat .bash_profile
export NVM_DIR="$HOME/.nvm"
[ -s "$NVM_DIR/nvm.sh" ] && \. "$NVM_DIR/nvm.sh"

加载环境变量，使其生效。

1	source ~/.bashrc

解决`node: 没有那个文件或目录`

1 2	user@user-pc:~/www/html/php-web/gitblog$ sudo npm install -g hexo-cli ##/usr/bin/env: “node”: 没有那个文件或目录

用ln -s命令设置一个软链接

1	sudo ln -s ~/.nvm/versions/node/v14.15.2/bin/node /usr/bin/node

安装`node`

查看可安装版本：

$ nvm ls-remote
...
...
      v16.13.0   (LTS: Gallium)
       v16.13.1   (Latest LTS: Gallium)
        v17.0.0
        v17.0.1
        v17.1.0
        v17.2.0

安装`node`

nvm install 16.13.1
Downloading and installing node v16.13.1...
Downloading https://nodejs.org/dist/v16.13.1/node-v16.13.1-linux-x64.tar.xz...
######################################################################### 100.0%
Computing checksum with sha256sum
Checksums matched!
Now using node v16.13.1 (npm v8.1.2)
Creating default alias: default -> 16.13.1 (-> v16.13.1)

查看已安装`node`

1
2
3

$ nvm list
->     v16.13.1
default -> 16.13.1 (-> v16.13.1)

使用某个已安装`node`版本

1	$ nvm use 14.18.2

查看`npm`版本

node已经附带安装npm，无需单独安装,查看其版本：

1 2	npm -v 8.1.2

如果不是最新版本，运行指令
npm install -g npm
如果想更新到指定版本，运行指令
npm -g install npm@6.8.0

nvm开源项目地址

其他升级`nodejs`方法：

（1）用`n`升级`nodejs`

全局安装n
npm install -g n
升级到最新稳定版
n stable
升级到最新版
n latest
升级到定制版
n v7.10.0
切换使用版本
n 7.10.0 (ENTER)
删除制定版本
n rm 7.10.0
用制定的版本执行脚本
n use 7.10.0 some.js

安装`git`

命令：

1	user@user-pc:~/.nvm$ npm install --lts ##长期支持版本

将Debian10.1中默认的node更改文件名：

1	mv /usr/bin/node /usr/bin/node10

在/etc/profile,添加新的node路径 /usr/local/bin

export PATH=$PATH:/usr/local/bin

二、安装`Next`主题并部署到`github`【含从`wordpress`中导出】

1、按照`Github`提示，创建`SSH秘钥`：

（1）命令：

mkdir ~/.ssh
cd ~/.ssh
user@user-pc:~/.ssh$ ssh-keygen -t rsa -C "邮箱地址"
Generating public/private rsa key pair.
Enter file in which to save the key (/home/用户名/.ssh/id_rsa): 
Enter passphrase (empty for no passphrase): 
Enter same passphrase again: 
Your identification has been saved in /home/用户名/.ssh/id_rsa.
Your public key has been saved in /home/用户名/.ssh/id_rsa.pub.
The key fingerprint is:
SHA256:0NY9YEJ+aCViuJzyv**juiZ8 邮箱地址
The key's randomart image is:
+---[RSA 2048]----+
|     .o.*o++.    |
|    .. * B=o     |
|  o. o      o    |
| ..o+o *     .   |
|   o*.o So .     |
| . =.o. .        |
|  * .... . .     |
| oo.o..          |
| .o=             |
+----[SHA256]-----+
user@user-pc:~/.ssh$ ls -a
.  ..  id_rsa  id_rsa.pub
user@user-pc:~/.ssh$ cat id_rsa.pub
ssh-rsa AAAAB3NzaC1yc2EAAAADAQABAAABAQDXoLe6b+9fvDT/L8hcz***************eh+GK4vVv+1dyv9 注册github的邮箱

（2）打开https://github.com/settings/keys，点击New SSH key新增 SSH KEY，tittledebian10内容如上
（3）新建并配置github仓库
①打开https://github.com/登录后，在右上角点击+==>New repository==>Repository name输入：XXX.github.io==>Create repository
②进入新仓库，Add file==>文件名CNAME,内容你的域名（域名需自己注册，没域名就直接用XXX.github.io访问网页）。
③点击仓库右边Settins==>网页下方pages==>Source选择master(因为网页文件上传是传到master分支)==>Custom domain根据上面你的域名填写。

关于域名解析在主机运营商处填写，比如WWW或者@等，记录值填写XXX.github.io.

（4）在电脑上配置git
在debian终端输入命令：

1 2	git config --global user.name "注册github的用户名" git config --global user.email "注册github的邮箱"

其他命令

git config --list  查看git配置
ssh -T git@github.com 查看与git的连接
[sudo] yk 的密码：
ssh: connect to host github.com port 22: Connection timed out

连接提示错误解决方法：

1	user@user-pc:~/.ssh$ sudo vim config

输入以下内容：

Host github.com
User 注册github的邮箱
Hostname ssh.github.com
PreferredAuthentications publickey
IdentityFile ~/.ssh/id_rsa
Port 443

设置和取消代理:

1 2	git config --global http.proxy 你的代理地址 git config --global https.proxy 你的代理地址

http://也可以改成sockets5://,但是区别在于：socks5不支持通过pubkey免密登录github，每次提交代码只能输入用户名和密码,http可以支持免密登录。
取消代理：

1 2	git config --global --unset http.proxy git config --global --unset https.proxy

2、安装`hexo`

命令：

1
2
3

sudo npm install -g hexo-cli
npm WARN deprecated fsevents@2.1.3: Please update to v 2.2.x
/usr/local/bin/hexo -> /usr/local/lib/node_modules/hexo-cli/bin/hexo

3、创建存放博客的文件夹

user@user-pc:~/www/html/php-web$ sudo mkdir gitblog
user@user-pc:~/www/html/php-web$ cd gitblog
user@user-pc:~/www/html/php-web/gitblog$ sudo hexo init   ##初始化hexo设置
user@user-pc:~/www/html/php-web/gitblog$ sudo npm install

user@user-pc:~/www/gitblogs$ sudo npm install urix
user@user-pc:~/www/gitblogs$ sudo npm install resolve-url

文件夹出现

.
├── _config.yml     #配置文件
├── package.json    #应用程序数据
├── scaffolds
├── source          #网站内容
|   ├── _drafts     #草稿
|   └── _posts      #文章
└── themes          #主题

4、安装`Next`主题

1	user@user-pc:~/www/gitblogs$ sudo git clone https://github.com/theme-next/hexo-theme-next themes/next

安装一些必备插件：

// user@user-pc:~/www/html/php-web/gitblog$ sudo npm i hexo-renderer-multi-markdown-it --save --ignore-scripts # 安装必备插件,`--ignore-scripts` 解决安装依赖失败问题,  
//但是安装此插件会出现数学公式重复解析  

user@user-pc:~/www/html/php-web/gitblog$ sudo npm i hexo-autoprefixer --save
user@user-pc:~/www/html/php-web/gitblog$ sudo npm i hexo-algoliasearch --save
user@user-pc:~/www/html/php-web/gitblog$ sudo npm i hexo-symbols-count-time --save
user@user-pc:~/www/html/php-web/gitblog$ sudo npm i hexo-feed --save

user@user-pc:~/www/gitblogs$ sudo npm uninstall hexo-renderer-marked --save
user@user-pc:~/www/gitblogs$ sudo npm install hexo-renderer-kramed --save

user@user-pc:~/www/gitblogs$ sudo npm uninstall hexo-math --save  #停止使用 hexo-math
user@user-pc:~/www/gitblogs$ sudo npm install hexo-renderer-mathjax --save  #然后安装 hexo-renderer-mathjax 包：

user@user-pc:~/www/gitblogs$ sudo npm install hexo-generator-search --save
user@user-pc:~/www/gitblogs$ sudo npm install hexo-generator-searchdb --save  # 本地搜索 #
user@user-pc:~/www/gitblogs$ sudo npm install hexo-tag-cloud@^2.1.* --save   ##标签云
user@user-pc:~/www/gitblogs$ sudo npm install eslint --save  ##阅读时长依赖

5、开启标签云：

swig 用户 (Next主题在列)

在主题文件夹找到文件 theme/next/layout/_macro/sidebar.swig, 然后添加如下代码：

{% if site.tags.length > 1 %}
<script type="text/javascript" charset="utf-8" src="/js/tagcloud.js"></script>
<script type="text/javascript" charset="utf-8" src="/js/tagcanvas.js"></script>
<div class="widget-wrap">
    <h3 class="widget-title">Tag Cloud</h3>
    <div id="myCanvasContainer" class="widget tagcloud">
        <canvas width="260" height="280" id="resCanvas" style="width=100%">
            {{ list_tags() }}
        </canvas>
    </div>
</div>
{% endif %}

6、从 `Wordpress` 迁移（没有用`wordpress`建站可无须此步）

（1）首先安装 hexo-migrator-wordpress 插件：

1	user@user-pc:~/www/html/php-web/gitblog$ sudo npm install hexo-migrator-wordpress --save

1	$ user@user-pc:~/www/html/php-web/gitblog$ sudo hexo migrate wordpress <source>

source 是 Wordpress 导出文件的存放目录：/media/yk/文档/BackUp/数据备份/Linux相关/Debian网站文章备份/lifeinpieces.WordPress.2020-12-16.xml。

文章导入到_posts 目录中了！

7、提交到`github`

安装支持：

1	user@user-pc:~/www/html/php-web/gitblog/owenyk.github.io$ sudo npm install hexo-deployer-git --unsafe-perm

提交命令：

1 2	user@user-pc:~/www/html/php-web/gitblog$ sudo hexo generate user@user-pc:~/www/html/php-web/gitblog$ sudo hexo deploy

一些问题：

1
2
3

user@user-pc:~/www/html/php-web/gitblog$  git remote add origin git@github.com:#####/#####.github.io.git
fatal: 不是一个 git 仓库（或者直至挂载点 / 的任何父目录）
停止在文件系统边界（未设置 GIT_DISCOVERY_ACROSS_FILESYSTEM）

解决：

user@user-pc:~/www/html/php-web/gitblog$ sudo git init
已初始化空的 Git 仓库于 /home/yk/www/html/php-web/gitblog/.git/
user@user-pc:~/www/html/php-web/gitblog$ sudo git remote add origin git@github.com:###/###.github.io.git
user@user-pc:~/www/html/php-web/gitblog$ sudo git remote -v
origin	git@github.com:###/###.github.io.git (fetch)
origin	git@github.com:###/###.github.io.git (push)

提示：This version of npm is compatible with lockfileVersion@1, but package-lock.json was generated for lockfileVersion@0. I'll try to do my best with it!
解决：

1	user@user-pc:~/www/gitblogs$ sudo rm -rf node_modules package-lock.json && npm install

8、换机操作

(1)、在你的博客`Repository`中新建一个`hexo`分支，名字自定：

(2)、然后在`setting`中设置默认分支为`hexo`，便于推送：

1	user@user-pc:~/www/html/php-web/gitblog$ sudo git clone https://github.com/owenyk/owenyk.github.io.git

(4)、把除了`.git` 文件夹外的所有文件都删掉（这些是编译后的网页文件）

1	user@user-pc:~/www/html/php-web/gitblog/owenyk.github.io$ sudo rm -rf [^.]*

(5)、把之前我们写的博客源文件全部复制过来，除了`.deploy_git`（编译后的文件目录）。

其中，.gitignore（设置不需要git的文件或目录）文件中中需要设置部分不需要上传的目录：
删除题中有一个.git目录
命令：

1
2
3

sudo git commit –m 'add branch'

sudo git checkout -b hexo_backup --track origin / hexo_backup

9、数学公式显示不正常问题：

第一步：使用`Kramed`代替`Marked`

hexo 默认的渲染引擎是 marked，但是 marked 不支持 mathjax。 kramed 是在 marked 的基础上进行修改。我们在工程目录下执行以下命令来安装 kramed.

1 2	npm uninstall hexo-renderer-marked --save npm install hexo-renderer-kramed --save

然后，更改<your-project-dir>/node_modules/hexo-renderer-kramed/lib/renderer.js，更改：

// Change inline math rule
function formatText(text) {
    // Fit kramed's rule: $$ + \1 + $$
    return text.replace(/`\$(.*?)\$`/g, '$$$$$1$$$$');
}

为：

// Change inline math rule
function formatText(text) {
    return text;
}

第二步: 停止使用 `hexo-math`

首先，如果你已经安装 hexo-math, 请卸载它：

1	npm uninstall hexo-math --save`

然后安装 hexo-renderer-mathjax 包：

1	npm install hexo-renderer-mathjax --save

第三步: 更新 `Mathjax` 的 `CDN` 链接

首先，打开<path-to-your-project>/node_modules/hexo-renderer-mathjax/mathjax.html

然后，把<script>更改为：
<script src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.1/MathJax.js?config=TeX-MML-AM_CHTML"></script>

第四步: 更改默认转义规则

因为 hexo 默认的转义规则会将一些字符进行转义，比如 _转为 <em>, 所以我们需要对默认的规则进行修改.
首先，打开<path-to-your-project/node_modules/kramed/lib/rules/inline.js,

然后，把:

1	escape: /^\\([\\`*{}\[\]()#$+\-.!_>])/,

更改为:

escape: /^\\([`*\[\]()# +\-.!_>])/,
````
把
```js
em: /^\b_((?:__|[\s\S])+?)_\b|^\*((?:\*\*|[\s\S])+?)\*(?!\*)/,

更改为:

1	em: /^\((?:\\\|[\s\S])+?)\(?!\*)/,

第五步: 开启`mathjax`

在主题_config.yml 中开启 Mathjax，找到 mathjax 字段添加如下代码：

1 2	mathjax: enable: true

这一步可选，在博客中开启 Mathjax，，添加以下内容：

---
title: Testing Mathjax with Hexo  
category: Uncategorized
date: 2017/05/03
mathjax: true
---

通过以上步骤，我们就可以在 hexo 中使用 Mathjax 来书写数学公式。

10、改变`tag`因为大小写问题而`404`的问题

在博客根目录下的.deploy_git/.git/config文件配置中忽略大小写选项ignorecase = true改成ignorecase = false（注意：.git是隐藏文件夹，记得调一下显示隐藏文件夹）。

11、`Windows`上部署时出现`warning: LF will be replaced by CRLF in xxxxxx`的警告问题

1	git config --global core.autocrlf false

参考资料：

换终端更新hexo博客：
git报错ssh: connect to host github.com port 22: Connection timed out:
Hexo博客建立标签云及效果展示:
hexo博客本地搜索失效，一直转圈:
如何在 hexo 中支持 Mathjax？：

一、nvm安装node

安装nvm

解决nvm安装成功后，但命令不可用(command not found)

解决node: 没有那个文件或目录

安装node

查看可安装版本：

安装node

查看已安装node

使用某个已安装node版本

查看npm版本

其他升级nodejs方法：

（1）用n升级nodejs

安装git

二、安装Next主题并部署到github【含从wordpress中导出】

1、按照Github提示，创建SSH秘钥：

2、安装hexo

3、创建存放博客的文件夹

4、安装Next主题

5、开启标签云：

6、从 Wordpress 迁移（没有用wordpress建站可无须此步）

7、提交到github

一些问题：

8、换机操作

(1)、在你的博客Repository中新建一个hexo分支，名字自定：

(2)、然后在setting中设置默认分支为hexo，便于推送：

(3)、新建目录，在目录下运行命令：

(4)、把除了.git 文件夹外的所有文件都删掉（这些是编译后的网页文件）

(5)、把之前我们写的博客源文件全部复制过来，除了.deploy_git（编译后的文件目录）。

9、数学公式显示不正常问题：

第一步： 使用Kramed代替Marked

第二步: 停止使用 hexo-math

第三步: 更新 Mathjax 的 CDN 链接

第四步: 更改默认转义规则

第五步: 开启mathjax

10、改变tag因为大小写问题而404的问题

11、Windows上部署时出现warning: LF will be replaced by CRLF in xxxxxx的警告问题

参考资料：

一、`nvm`安装`node`

安装`nvm`

解决`nvm`安装成功后，但命令不可用(`command not found`)

解决`node: 没有那个文件或目录`

安装`node`

安装`node`

查看已安装`node`

使用某个已安装`node`版本

查看`npm`版本

其他升级`nodejs`方法：

（1）用`n`升级`nodejs`

安装`git`

二、安装`Next`主题并部署到`github`【含从`wordpress`中导出】

1、按照`Github`提示，创建`SSH秘钥`：

2、安装`hexo`

4、安装`Next`主题

6、从 `Wordpress` 迁移（没有用`wordpress`建站可无须此步）

7、提交到`github`

(1)、在你的博客`Repository`中新建一个`hexo`分支，名字自定：

(2)、然后在`setting`中设置默认分支为`hexo`，便于推送：

(4)、把除了`.git` 文件夹外的所有文件都删掉（这些是编译后的网页文件）

(5)、把之前我们写的博客源文件全部复制过来，除了`.deploy_git`（编译后的文件目录）。

第一步：使用`Kramed`代替`Marked`

第二步: 停止使用 `hexo-math`

第三步: 更新 `Mathjax` 的 `CDN` 链接

第五步: 开启`mathjax`

10、改变`tag`因为大小写问题而`404`的问题

11、`Windows`上部署时出现`warning: LF will be replaced by CRLF in xxxxxx`的警告问题