Mac OS环境下使用Hexo搭建个人博客
本文最后更新于 94 天前,其中的信息可能已经有所发展或是发生改变。

网上大部分基于Hexo搭建个人博客的教程都是在Windows环境下实现的,Mac OS的教程很少,然而,Mac OS下完成这个任务远比Windows要容易。

出现$代表这是终端命令,请逐条在终端内执行,并且不要将$符号一并输入终端

准备工作

安装 Homebrew

Homebrew 是一个社区驱动的包管理器,它能方便我们安装我们需要的环境。在中国大陆,推荐使用镜像源安装 Homebrew,下面以中科大镜像源为例。

设置环境变量:

$ export HOMEBREW_BREW_GIT_REMOTE="https://mirrors.ustc.edu.cn/brew.git"
$ export HOMEBREW_CORE_GIT_REMOTE="https://mirrors.ustc.edu.cn/homebrew-core.git"
$ export HOMEBREW_BOTTLE_DOMAIN="https://mirrors.ustc.edu.cn/homebrew-bottles"
$ export HOMEBREW_API_DOMAIN="https://mirrors.ustc.edu.cn/homebrew-bottles/api"

运行中科大 Homebrew 安装脚本:

$ /bin/bash -c "$(curl -fsSL https://mirrors.ustc.edu.cn/misc/brew-install.sh)"

如果你的网络环境良好(不在中国大陆),可以略过设置环境变量的步骤并直接使用正常的安装脚本:

$ /bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)"

安装 Git 和 Node.js

Homebrew安装完成后,安装 Git 和 Node.js:

$ brew install git
$ brew install node

测试所需组件是否安装成功

依次输入下面的命令

$ npm -v
$ node -v
$ git --version
command_line_to_test_installation

出现npm、Node.js和git的版本号即代表安装成功。

安装 Hexo

我们使用 npm 命令安装 Hexo:

$ npm install -g hexo-cli

等待安装完成后初始化博客:

$ hexo init blog

这条指令的作用是在你目前所在的目录下(默认是你的home目录)新建一个名为blog的文件夹(你可以将这条命令中的blog替换成任何你想要的名字),并在内初始化你的博客。之后所有的操作都在这个文件夹下进行,请确保在执行后文的操作前已经切换到了这个文件夹(cd blog)。

待初始化完成,切换到blog文件夹中,即可生成和预览博客。

$ cd blog
$ hexo g
$ hexo s

执行hexo s命令后,通过浏览器访问http://127.0.0.1:4000可以预览你的博客,预览功能会实时监测博客的文件变化,并实时反馈在浏览器上,在调试博客前端时非常好用。

preview_your_hexo_blog

部署网站到GitHub

执行hexo g命令后博客静态文件会生成在public文件夹下,只需要将这些文件上传到你的静态网站托管服务即可将站点发布到公网,本文用到的托管服务是Github Pages,下文提到的用户名均指你的Github用户名。

添加SSH Key到github

若之前使用过相关功能且已经配置过请跳过此步。

配置Git用户名和账号:

$ git config --global user.name "username"
$ git config --global user.email "[email protected]"

其中 username 是你的用户名,[email protected]是你 Github 的登录邮箱。

然后通过终端命令生成 SSH Key:

$ ssh-keygen -t rsa -C "[email protected]"

如果已经创建过会出现 Overwrite (y/n)? n提示可以输入 n,没有创建过的话三个回车就好,执行完成后会在~/.ssh/id_rsa.pub目录下生成 需要使用的 key,也就是公钥。

到账户主文件夹下同时按Command+Shift+.显示隐藏文件,找到.ssh文件夹,打开id_rsa.pub,将里面的内容全部复制。

打开GitHub_Settings_keys 页面,新建New SSH Key,Title随意填,Key就把刚才复制的内容全都粘贴上去。然后点Add SSH Key即可。

github_key_settings页面

完成这些工作以后可以通过以下命令测试是否配置成功:

$ ssh [email protected]
connecting_to_github_using_ssh

出现你的Github用户名代表配置成功。

上传本地文件到 Github

在Github上新建一个仓库,Repository Name 填你的用户名.github.io,仓库状态设为 Public,点击 Create Repository 创建新的网站仓库。

安装 Hexo 的扩展 hexo-deployer-git,注意一定要在你的博客文件夹下执行:

$ npm install hexo-deployer-git --save

编辑博客安装文件夹下的_config.yml文件,翻到底部,修改deploy部分为:

deploy:
type: git
repo: [email protected]:你的用户名/你的用户名.github.io.git
branch: master

修改完成后按Command + S保存,此时就可以使用hexo d把存在本地的博客deploy到Github上了:

$ hexo g
$ hexo d
error_occured_when_deploying_hexo_to_githubpages

第一次执行hexo d命令时可能要求你输入你的Github账号和密码,这里如果依照提示按部就班输入你的账户密码会出现如图所示的报错,这是因为Github在2021年8月13日停止了使用账户密码认证的支持,这时需要在Gihub上Developer Settings页面上新建一个Personal Access Token代替密码就可以顺利deploy。

执行完毕后,访问你的用户名.github.io就能看到你的博客了。

绑定自定义域名(可选)

其实到这一步就可以开始写博客了,默认的 github.io 的域名是可以更换的:

首先自行申请一个域名,登陆到域名申请的后台,添加一条CNAME解析记录:你的用户名.github.io

打开存放博客的Github仓库,进入Settings页面在pages选项里的Custom domain里填入你的域名,点击Save,勾选Enforce HTTPS,即可通过自定义域名访问你的博客。

bond_personal_domain_with_githubpages(github_settings)

开始写作

生成一篇新文章:

$ hexo new <title>

执行后会在blog/source/_post文件夹里生成一个名为<title>.md的文件,打开它即可使用 Markdown 开始写作

markdown_metadata

值得一提的是,Hexo生成时真正显示的标题是<title>.md文件里title项的标题,文件名影响的是生成后文章的永久链接。

写作完成后执行:

#注意以下命令需要切换到blog文件夹(cd blog)执行
$ hexo g
$ hexo d

即可将文章发布,根据主题的不同,最好在执行hexo g前先执行:

$ hexo clean

以避免潜在的问题。

Hexo常用命令

#注意以下命令需要切换到blog文件夹(cd blog)执行
hexo n "文章名称"  => hexo new "文章名称"  #这两个都是创建新文章,前者是简写模式,下同,new后面加一个draft可以生成草稿
hexo p  => hexo publish  #发布草稿
hexo g  => hexo generate  #生成
hexo s  => hexo server  #启动服务预览
hexo d  => hexo deploy  #部署

hexo server   #Hexo 会监视文件变动并自动更新,无须重启服务器。
hexo server -s   #静态模式
hexo server -p 5000   #更改端口
hexo server -i 192.168.1.1   #自定义IP
hexo clean   #清除缓存,网页正常情况下可以忽略此条命令
本文采用 CC BY-NC-SA 4.0 协议进行许可,在您遵循此协议的情况下,可以自由共享与演绎本文章。

本文链接:https://l3zc.com/2022/05/mac%e7%8e%af%e5%a2%83%e4%b8%8b%e4%bd%bf%e7%94%a8hexo%e6%90%ad%e5%bb%ba%e4%b8%aa%e4%ba%ba%e5%8d%9a%e5%ae%a2/

评论

  1. 手品木
    Macintosh Safari
    1月前
    2023-8-20 12:14:15

    按照教程搞完了提示404
    There isn’t a GitHub Pages site here.

    • 博主
      手品木
      Windows Firefox
      已编辑
      1月前
      2023-8-21 12:26:29

      想办法排查:

      • 博客生成到public文件夹下了吗
      • hexo d以后仓库里有文件吗
      • 仓库的Github Pages开了吗

      一步一步找问题。

  2. ShiiNashi
    Macintosh Safari
    4月前
    2023-6-09 23:23:07

    现在在执行hexo init blog之后,会自动在当前目录下新建一个blog,就会嵌套一个blog文件夹,后面的命令就执行不下去了。

    解决办法是不用新建blog,直接在terminal执行hexo init blog就可以。我是macOS,win不知道是不是这样。

    • 博主
      ShiiNashi
      Windows Chrome
      4月前
      2023-6-10 11:43:47

      感谢指出,核实过了,确实如此,已经更新文章。

  3. Jason
    Macintosh Chrome
    6月前
    2023-3-21 21:09:30

    我输入cd blog
    hexo init blog时出现了zsh: command not found: hexo,不知道为什么

    • 博主
      Jason
      Windows Chrome
      6月前
      2023-3-21 21:16:51

      看上去是Hexo还没有安装成功?也许可以试着重新执行一下前面的步骤

发送评论 编辑评论


|´・ω・)ノ
ヾ(≧∇≦*)ゝ
(☆ω☆)
(╯‵□′)╯︵┴─┴
 ̄﹃ ̄
(/ω\)
∠( ᐛ 」∠)_
(๑•̀ㅁ•́ฅ)
→_→
୧(๑•̀⌄•́๑)૭
٩(ˊᗜˋ*)و
(ノ°ο°)ノ
(´இ皿இ`)
⌇●﹏●⌇
(ฅ´ω`ฅ)
(╯°A°)╯︵○○○
φ( ̄∇ ̄o)
ヾ(´・ ・`。)ノ"
( ง ᵒ̌皿ᵒ̌)ง⁼³₌₃
(ó﹏ò。)
Σ(っ °Д °;)っ
( ,,´・ω・)ノ"(´っω・`。)
╮(╯▽╰)╭
o(*////▽////*)q
>﹏<
( ๑´•ω•) "(ㆆᴗㆆ)
😂
😀
😅
😊
🙂
🙃
😌
😍
😘
😜
😝
😏
😒
🙄
😳
😡
😔
😫
😱
😭
💩
👻
🙌
🖕
👍
👫
👬
👭
🌚
🌝
🙈
💊
😶
🙏
🍦
🍉
😣
Source: github.com/k4yt3x/flowerhd
颜文字
Emoji
小恐龙
花!
上一篇
下一篇