Mac上hexo博客的搭建
第一篇hexo博客,介绍了在mac上搭建hexo博客的全过程。包括:准备工作、本地站点的建立、启动和部署站点、创建新文章、发布到github、更换主题 和 绑定域名。
在介绍之前先秀一波我搭的成果: 夏天的风的博客
准备工作
- github
- homebrew
- node.js 和 npm
- hexo
github
1、github账号
这部分略过,没有的话自己注册一个。然后将mac上的公钥添加到github上去。
2、建立仓库
严格按照 git用户名
.github
.io
来命名。我这里就叫:xiaqunfeng.github.io
。
homebrew
homebrew 是MAC OSX 上面用来安装 或者 卸载软件用的非常方面的一个软件。在终端上执行如下命令即可安装,参考官网。
sudo /usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"
node.js
不推荐使用 brew 安装node, 直接从官网下载,然后双击安装。我这里选择的版本是:v6.9.3 LTS。node.js 集成带有npm。
$ node -v
v6.9.3
$ npm -v
3.10.10
hexo
$ sudo npm install hexo-cli -g
安装完后
$ hexo -v
hexo: 3.2.2
hexo-cli: 1.0.2
os: Darwin 16.1.0 darwin x64
http_parser: 2.7.0
node: 6.9.3
v8: 5.1.281.89
uv: 1.9.1
zlib: 1.2.8
ares: 1.10.1-DEV
icu: 57.1
modules: 48
openssl: 1.0.2j
hexo命令行使用
常用命令:
hexo help #查看帮助
hexo init #初始化一个目录
hexo new "postName" #新建文章
hexo new page "pageName" #新建页面
hexo generate #生成网页,可以在 public 目录查看整个网站的文件
hexo server #本地预览,'Ctrl+C'关闭
hexo deploy #部署.deploy目录
hexo clean #清除缓存,强烈建议每次执行命令前先清理缓存,每次部署前先删除 .deploy 文件夹
简写:
hexo n == hexo new
hexo g == hexo generate
hexo s == hexo server
hexo d == hexo deploy
建立本地站点
执行下列命令,Hexo 将会在指定文件夹中新建所需要的文件。(文件夹不需要提前建好,会自行创建)
$ hexo init <folder>
$ cd <folder>
$ npm install
新建文件夹目录如下:
.
├── .deploy #需要部署的文件
├── node_modules #Hexo插件
├── public #生成的静态网页文件
├── scaffolds #模板
├── source #博客正文和其他源文件
| ├── _drafts #草稿(刚开始没有)
| └── _posts #文章
├── themes #主题
├── _config.yml #全局配置文件
└── package.json
启动站点
执行 hexo server 启动站点
$ hexo s
INFO Start processing
INFO Hexo is running at http://localhost:4000/. Press Ctrl+C to stop.
在浏览器中输入:http://localhost:4000 就可以看到站点了。
部署站点
编辑文件 _config.yml
,修改如下:
deploy:
type: git
repository: https://github.com/xiaqunfeng/xiaqunfeng.github.io.git
branch: master
注意:冒号后面要留 空格!!
创建新文章
方法1、hexo n
创建新文章
$ hexo n "我的第一篇hexo博客"
INFO Created: ~/hexo-blog/source/_posts/我的第一篇hexo博客.md
然后用编辑器打开编辑即可。
方法2、直接在 source/_posts
中新建一个md文件,进行编辑
在hexo-blog文件夹下执行:
hexo g
hexo s
然后在浏览器中输入http://localhost:4000
就可以看到新加的文章了。
发布
执行 hexo d
,发现如下问题
$ hexo d
ERROR Deployer not found: git
解决方法
$ npm install hexo-deployer-git --save
hexo-site@0.0.0 /Users/xiaqunfeng/hexo-blog
└── hexo-deployer-git@0.2.0
再执行 hexo d
$ hexo d
INFO Deploying: git
INFO Clearing .deploy_git folder...
INFO Copying files from public folder...
On branch master
nothing to commit, working tree clean
Username for 'https://github.com': xiaqunfeng
Password for 'https://xiaqunfeng@github.com':
To https://github.com/xiaqunfeng/xiaqunfeng.github.io.git
* [new branch] HEAD -> master
Branch master set up to track remote branch master from https://github.com/xiaqunfeng/xiaqunfeng.github.io.git.
INFO Deploy done: git
输入github的用户名和密码即可。此时,博客已经完全搭建起来了。
在浏览器中输入:https://xiaqunfeng.github.io/ 即可访问。
预览如下:
更换主题
自己google一下hexo主题,选一个自己喜欢的,然后git clone下来。比如 Next 主题
$ git clone https://github.com/iissnan/hexo-theme-next.git
然后打开_config.yml文件,替换其中的 theme
属性,默认为 landscape
。
theme: next
本地调试
$ hexo g #生成静态页面,生成的内容在public文件夹下
$ hexo s #启动本地服务,进行文章预览调试。hexo s --debug 命令可以用来调试
发布到github
1、清理之前生成的内容,即public文件。
注意:这一步必须要,不然有时因为缓存问题,服务器更新不了主题
$ hexo clean
2、生成静态文件并部署到github
$ hexo g #生成静态文件
$ hexo d #部署到github
上面两个命令可以合并为一个:
$ hexo d -g #在部署前先生成
绑定域名
我暂时还没购买和绑定域名,就暂时先简单介绍一下,后续再来补充完善。
1、购买域名
某乎这里有各种推荐,自己可以参考的看看。
godaddy地址: https://www.godaddy.com
阿里云域名地址: http://wanwang.aliyun.com
2、到自己的gitHubPages的ip地址
ping http://xiaqunfeng.github.io
PING github.map.fastly.net (151.101.192.133): 56 data bytes
64 bytes from 151.101.192.133: icmp_seq=0 ttl=49 time=62.670 ms
64 bytes from 151.101.192.133: icmp_seq=1 ttl=49 time=65.062 ms
...
这里IP地址为:151.101.192.133
3、域名绑定IP地址
登录自己购买域名的地方,找到域名相关选项
添加域名
添加记录:一个主机记录 @
, 一个为www
,记录值都是博客主页对应的ip。
等待生效,最迟72小时生效,然后就可通过域名浏览你的博客主页了。