已收录(2017-8-15)

Hexo深坑之旅(4)— Mac系统下搭建Hexo

2017-03-24  本文已影响57人  璀璨星空中的一抹光亮

前言:此前笔者曾在win7系统中用hexo+jacman搭建过一次个人博客,期间几经波折,踏过不少深坑。而由于前段时间刚入手了一台MacAir,不得已又要再次踏上这场深坑之旅。好在万变不离其中,虽说是两个系统,但大部分的操作还是相同的,所以在这篇文章中主要介绍Mac系统下的注意点。而至于详细的操作请参考笔者的另一篇文章:Hexo深坑之旅(1)- win7系统下安装hexo

开始须知

终端

打开

按下快捷键 Ctrol+ Space 空格键,激活 Spotlight 搜索,随后在搜索框中输入“终端”关键字。

终端.png

命令

cd 前往目标文件。例:

cd /Users/Desktop/前端画室/web前端/blog

1.环境配置

1. 1Node.js

node.js
Node.js 是一个基于 Chrome V8 引擎的 JavaScript 运行环境。 简单来说你也可以把它看成是一个运行在服务器端的JavaScript语言。这里主要是用于创建hexo博客的框架从而生成静态页面。
Node.js官网
Node.js官网(中文)
这里推荐下载v6版本,因为v7版本的坑比较多,不适合新手。
下载安装后,可以在终端中用以下命令检测是否安装成功。
node -v
npm -v

如果有版本号显示则表示安装成功

Macbook Air:blog$ node -v
v6.10.1
Macbook Air:blog$ npm -v
3.10.10

1.2 Git

Git官网
Git是一款免费、开源的分布式版本控制系统,所谓分布式(类似于星形网络)即是可以将项目分布到任何一台电脑中供用户使用,使每台电脑都相当于“主服务器”。而版本控制则可以查看每一次提交或修改的历史记录。Git的优点在于可以灵活高效地处理任何或小或较大的项目。

git

1.2.1 xcode

对于Mac用户来说推荐使用苹果开发的 xcode ,自带有git,可以在App Store中自行下载安装。


Xcode.png

由于xcode默认没有安装命令行工具,因此安装完成后,还需要在xcode中下载 Command Line Tools 工具。
(1) 在终端(terminal)中输入命令:

$ xcode-select --install

(2)安装 xcode-select

xcode-select.png
(3)再次在终端(terminal)中输入命令:xcode-select --install 检验是否安装成功:
xcode-select --install.png
如上图,则成功安装。这时在打开xcode新建一个项目,选择macOS,就能看到 Command Line Tools
tool.png

1.2.2 下载安装包

mac也可以使用 Homebrew, MacPortsbrew install git
;或下载 安装程序 安装。
本人并没有尝试,所以不多说,详细方法可查看hexo官方文档

2.安装Hexo

2.1安装

Hexo 是一个快速、简洁且高效的博客框架。Hexo 使用 Markdown(或其他渲染引擎)解析文章,在几秒内,即可利用靓丽的主题生成静态网页。
注意! 注意! 注意!
由于hexo新版本的问题,很多原来的方法都已失效,因此在搜索资料时一定要注意文章发布时间。
查看hexo官方文档,打开终端执行命令:

$ npm install -g hexo-cli

不过有时会因为权限问题而报错,推荐加上 sudo命令 (可能会提示输入系统管理员密码):

$ sudo npm install -g hexo

2.2初始化

先新建一个文件夹,用来存放hexo,如blog。
然后用终端 cd 到blog的目录下,执行命令:

$ hexo init

执行:

$ sudo npm install -g

执行 $ hexo -v 查看hexo版本:

hexo.png
这时打开blog文件夹,可以看到已经生成了hexo文件
blog.png
执行命令,开启本地服务器:
$ hexo s

然后在浏览器中打开网址http://localhost:4000,能看到如下页面:

hexo4000.png

3.关联Github

3.1 注册Github账号并创建仓库

参考:Hexo深坑之旅(1)- win7系统下安装hexo

3.2添加ssh key到Github

首先检查SSH-keys是否存在,打开终端执行命令:

MacBook-Air:~ zhoujunyang$ cd ~/.ssh
MacBook-Air:.ssh zhoujunyang$ ls
id_rsa      id_rsa.pub  known_hosts

如果有文件id_rsa.pub或id_dsa.pub,则直接进入将SSH key添加到Github中,否则进入下一步生成SSH key

$ ssh-keygen -t rsa -C "your_email@example.com"

your_email@example.com 为Github的邮箱地址。
默认会在相应路径下(~/.ssh/id_rsa.pub)生成id_rsa和id_rsa.pub两个文件。
打开id_rsa.pub文件,复制里面的信息。

ssh.png

进入Github –> Settings –> SSH keys –> add SSH key:

key.png

Title里任意添一个标题,将复制的内容粘贴到Key里,点击下方Add key绿色按钮即可。

title.png

3.3配置文件

打开blog文件夹下的 _config.yml文件,修改参数:

deploy:
    type: git
    repository: git@github.com:zhouxiaoyu1994/zhouxiaoyu1994.github.io.git
    branch: master

你需要将repository后zhouxiaoyu1994换成你自己的用户名。

3.4本地上传

需先安装 hexo-deployer-git

$npm install hexo-deployer-git --save

执行命令:

$ hexo clean      清除缓存文件
$ hexo generate     或者hexo g 生成静态文件。
$ hexo deploy            或者hexo d 部署网站。

最后,浏览器中打开网址http://zhouxiaoyu1994.github.io(将zhouxiaoyu1994换成你的用户名)能看到和打开http://localhost:4000 时一样的页面。

上一篇 下一篇

猜你喜欢

热点阅读