本文介绍MacOS通过hexo搭建个人博客网站的流程
2022-8-17 | MacOS:11.6.8
Hexo 是一个快速、简洁且高效的博客框架。Hexo 使用 Markdown(或其他渲染引擎)解析文章,在几秒内,即可利用靓丽的主题生成静态网页。
根据hexo官方文档,安装 Hexo 相当简单,只需要先安装下列应用程序即可:
Git官网只提供Homebrew等安装方法,本人使用镜像资源网站sourceforge.net下载安装包安装程序。
注:Mac 用户如果在编译时可能会遇到问题,请先到 App Store 安装 Xcode,Xcode 完成后,启动并进入 Preferences -> Download -> Command Line Tools -> Install 安装命令行工具。如果安装包出现“无法打开git-2.15.0-intel-universal-mavericks.pkg,因为它来自身份不明的开发者”,前往 设置 -> 安全性与隐私 进行操作。
Node.js 为大多数平台提供了官方的 安装程序。对于中国大陆地区用户,可以前往 淘宝 Node.js 镜像 (不是说淘宝购买,是指淘宝的源,我没试过)下载。Mac:使用 Homebrew 或 MacPorts 安装。
安装 Hexo
所有必备的应用程序安装完成后,即可使用 npm 安装 Hexo。
$ npm install -g hexo-cli
Mac / Linux 用户:如果在尝试安装 Hexo 的过程中出现 EACCES
权限错误,请遵循 由 npmjs 发布的指导 修复该问题。强烈建议 不要 使用 root、sudo 等方法覆盖权限。
报错示例:
1 | npm notice |
指导文件翻译
解决全局安装包时EACCES权限错误
如果在尝试全局安装软件包时发现EACCES错误,您可以:
·使用节点版本管理器(node version manager)重新安装npm(推荐)
或
·手动更改npm的默认目录使用节点版本管理器重新安装npm
这是避免权限问题的最佳方法。要使用节点版本管理器重新安装npm,请按照“下载并安装node.js和npm”中的步骤进行操作。您不需要删除当前版本的npm或节点。js,然后安装节点版本管理器。
手动更改npm的默认目录
注:仅限macOS
为了将权限错误的可能性降至最低,您可以将npm配置为使用不同的目录。在本例中,您将在主目录中创建并使用隐藏目录。
- 备份(废话)
- 终端(terminal)里,在用户根目录(默认状态)创建文件夹:
mkdir ~/.npm-global
- 配置npm以使用新目录路径:
npm config set prefix '~/.npm-global'
- 在文本编辑器中,创建 ~/.profile 文件并添加此行:
export PATH=~/.npm-global/bin:$PATH
- 终端中,更新系统变量:
source ~/.profile
- 除了2-4步之外,如果你不想更改 ~/.profile 文件,也可以使用对应的环境变量:
NPM_CONFIG_PREFIX=~/.npm-global
安装 Hexo
所有必备的应用程序安装完成后,即可使用 npm 安装 Hexo。
$ npm install -g hexo-cli
建站
注:
安装以后,可以使用以下两种方式执行 Hexo:
npx hexo <command>
- 将 Hexo 所在的目录下的
node_modules
添加到环境变量之中即可直接使用hexo <command>
:
echo 'PATH="$PATH:./node_modules/.bin"' >> ~/.profile
安装 Hexo 完成后,请执行下列命令,Hexo 将会在指定文件夹中新建所需要的文件。
1 | $ hexo init <folder> |
新建完成后,指定文件夹的目录如下:
.
├── _config.yml
├── package.json
├── scaffolds
├── source
| ├── _drafts
| └── _posts
└── themes
启动服务站点
1 | hexo g |
结果:
1 | [hahaguowang@hahaguowangdeMac-mini hhgw_blog % hexo g |
访问http://localhost:4000/ 至此hero就搭建好了。可以在本地访问了。
将hexo博客站点上传到github上
这里hhgw_blog目录下需要安装一个hexo的上传插件deploy-git
npm install hexo-deployer-git --save
ls -l 查看:
1 | [hahaguowang@hahaguowangdeMac-mini hhgw_blog % ls -l |
修改hexo配置文件指定仓库路径
可在文件夹中直接打开文件 _config.yml ,也可通过vim直接编辑
找到Deployment加上(注意空格)
deploy:
type: git
repo: https://github.com/hhgw/hhgw.github.io
branch: main # 或者master 看自己的brench叫啥
推送命令:
1 | hexo d |
推送过程中需要输入你的github用户名和密码。但是在2021年8月14日开始github官方就加强安全访问。不能通过原有账号密码git访问,密码需要用官方的token或者采用ssh公私钥访问。否则会出现下图:鉴权失败(用户名密码错误)
1 | remote: Support for password authentication was removed on August 13, 2021. |
解决方式就是获取token,登录github设置setting->Developer Settings->Prosonal access tokens 创建一个新token。然后就可以拿这个token当密码输入了。
另外,全局科学上网后,可能还会出现连接不成功的情况,系网络问题,多次尝试hexo d
即可。
重新设置密码:
在_config.yml中:
deploy:
type: git
repo: https://[email protected]/hhgw/hhgw.github.io
branch: main
其中xxxxxxx就是token,填充进去即可
尝试访问
输入地址即可访问成功:
更换主题
博客样式太死板,想换成属于自己的风格,没问题我们可以更换博客的主题,来达到我们想要的风格。
到GitHub上搜索hexo主题或者hero自带的主题找一个喜欢的。
按照各自的主题文档上面一步步操作即可。
一般包括:
下载解压
放到主题包themes文件夹下
在hero配置文件 _config.yml 中修改为喜欢主题的名字
hexo server启动即可访问
更新仓库
本地调试完之后。就可以更新到github上了
1 | hexo clean 清理 |
添加.md文章
在站点文件夹中打开 git ,输入如下命令创建文章,其中 我的第一篇博客 为文章的标题。hexo会在source文件夹下创建一个markdowm的文件。这就是你要编写的文章。
Markdown 是一种可以使用普通文本编辑器编写的 标记语言,通过简单的 标记语法,它可以使普通文本内容具有一定的格式
基于 Markdown 语法的简洁性,它已经成为目前世界上最流行的用于书写博客的语言
hexo new "bulabula"
markdown 记得加title:
1
2
3 ---
title: Hello World
---
草稿箱
很多时候我们需要先写成草稿,而暂时不发布出去。draft page就可以满足我们的要求,我们的网站上是看不到草稿文件的。
1 | hexo new draft b 新建草稿 |
新建页面
有时我们不满足主题自由的一些页面,希望自己添加一些页面。
我们可以新建页面,新建页面则会在hexo的source中新建该页面文件并生成md文件,这就是你要编辑的博客页了。
1 | hexo new page "resouces" |
然后打开主题的配置文件_config.yml
,在菜单属性menu
中的添加如下(注意不是Hexo的配置文件)
将页面路径联接到页面上去
格式如下:
菜单自定义名称: /生成的页面名称
1
2
3
4
5 menu:
主页: /
技术笔记: https://xxxx
随笔: /tags/随笔/
资源: /resources
当我们点击资源时后会跳转到我们自定义的博客页了
域名:
购买域名后,
在source中,创建 CNAME
文件,文件添加域名 –> blog.hahaguowang.com
。注意:文件名全部大写,没有后缀;文件内容只有域名;