使用 Hexo + Github 搭建博客教程,支持在新电脑同步管理项目和主题

安装环境

本地安装git, node

安装hexo

使用npm安装hexo,官方提供的详细安装方法:
https://hexo.io/zh-cn/docs/

安装一些必要的插件:

$  sudo  npm install hexo-deployer-git --save    //安装Git部署器
$  sudo npm install hexo-generator-index --save 
$  sudo npm install hexo-generator-archive --save 
$  sudo npm install hexo-generator-category --save 
$  sudo npm install hexo-generator-tag --save 
$  sudo npm install hexo-server --save 
$  sudo npm install hexo-deployer-heroku --save 
$  sudo npm install hexo-deployer-rsync --save 
$  sudo npm install hexo-deployer-openshift --save 
$  sudo npm install hexo-renderer-marked@0.2 --save 
$  sudo npm install hexo-renderer-stylus@0.2 --save 
$  sudo npm install hexo-generator-feed@1 --save 
$  sudo npm install hexo-generator-sitemap@1 --save

GitHub准备工作

  1. 在github上新建一个仓库,命名规则为 git用户名.github.io。仓库默认有个master分支。

  2. 另新建一个分支 gh_pages,并将此分支设置为 default_branch(默认分支)。
    该分支用来存放和管理整个开发项目的代码,我们只需要手动管理gh_pages分支。
    通过 hexo d 部署命令会将生成的文件自动提交到master分支。

  3. 将GitHub的空项目仓库clone到本地。本地新建一个分支 gh_pages, 切换到这个分支。
    然后一直在此分支下开发,推送远程的时候也是推送到gh_pages同名远程分支。

$  git clone <git项目的url>
$  cd username.github.io
$  git checkout -b gh_pages

hexo流程

1. 新建本地站点

安装完hexo后,在项目根目录(username.github.io)下,运行以下命令,会自动生成项目所需文件。

$  hexo init
$  npm install

完成后,文件夹中目录如下:

├── _config.yml
├── package.json
├── scaffolds
├── source
|    └── _posts
|
└── themes

因为要将此项目推送到远程GitHub,我们需要添加一个 .gitignore 文件,忽略掉安装的插件,因为其没必要提交到远程:

// .gitignore
node_modules

然后,运行 hexo server启动站点。

$  hexo server   // 可简写为 hexo s

站点默认链接为 http://0.0.0.0:4000 或 http://localhost:4000 ,在浏览器打开此地址即可看到站点了。

2. 新建文章

$  hexo new '文章标题'

会在source/_posts/ 目录下生成一个新的markdown格式的文件。
在此文件编辑和保存自己的新文章。

3. 生成 html js 站点文件

$  hexo generate    // 可简写为 hexo g

会在 public 文件夹中生成页面需要的完整的html js等文件。

4. 发布

发布之前,先需要在根目录的 _config.yml 配置文件里关联上你的 github 地址。

// _config.yml

deploy:
  type: git
  repository: <git项目的url>
  branch: master

// 然后在命令行运行 hexo deploy,首次运行会按要求填写GitHub账号和密码
$  hexo deploy     // 可简写为 hexo d

这样,会把 public 文件夹里面的文件,推送到github仓库里。
然后,在浏览器中打开 <username>.github.io 就可以看到所搭建的线上的静态页面了。

安装主题

在网上找到自己喜欢的主题,clone到 themes 文件夹下。
以安装even主题为例,在根目录下运行如下命令:

$  git  clone  https://github.com/ahonn/hexo-theme-even  themes/even

修改根目录下的 _config.yml 文件,将主题名字改为 even

# Extensions
## Plugins: https://hexo.io/plugins/
## Themes: https://hexo.io/themes/
theme: even

运行以下命令就可以看到新主题的效果了:

$  hexo g    // 生成
$  hexo s    // 开启本地服务预览
$  hexo d    // 发布

一定要把主题文件也提交到远程仓库,可以自己自定义主题样式,换电脑后还可以同步自己配置的主题。
此时本地的git仓库跟踪不到 /themes 文件下新加的主题文件。我们只需要把 /themes/even 文件目录下的 .git 文件夹删除就可以了。

$  rm -rf .git

然后 /themes/even 下的文件就可以被 git 跟踪到了。

推送到远程

文章发布完后,我们把本地仓库推送到远程仓库的 gh_pages 分支。

$  git commit -am 'add hexo'
$  git push origin gh_pages

在新电脑上同步这个项目(包括主题),步骤:

$  git clone <git项目的url> 
$  cd username.github.io      // 默认分支为 gh_pages

$  npm install hexo -g
// 此时不需要在项目根目录运行 hexo init 命令,否则会将所有文件初始化掉。
$  npm install
$  hexo s      // 看是否能成功开启本地服务了

$  hexo new 'new article title'
$  hexo g
$  hexo d

$  git commit -am 'add hexo files'
$  git push origin gh_pages
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 204,293评论 6 478
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 85,604评论 2 381
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 150,958评论 0 337
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 54,729评论 1 277
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 63,719评论 5 366
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,630评论 1 281
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 38,000评论 3 397
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,665评论 0 258
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 40,909评论 1 299
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,646评论 2 321
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,726评论 1 330
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,400评论 4 321
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 38,986评论 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 29,959评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,197评论 1 260
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 44,996评论 2 349
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,481评论 2 342

推荐阅读更多精彩内容