0%

Hexo搭建

概述

本文主要针对mac OS

我们可能看见过类似于这样的博客

WX20170527-115859

相对于csdn、简书等网站,个人博客更加自由,文章格式排版等能够自定义。程序员更应该搭建一个专属于自己的博客了。

hexo可以基于github打造一套快捷编写以及独特的个人网站

1.创建Github 域名和空间

1.1 注册GitHub账号

注意注册账号后,username必须小写,你的域名将会是 username.github.io(此处不会修改username自行谷歌)

1.2 创建仓库

点击首页任意位置出现的 New repository按钮创建仓库, Respository name 中的username.github.io 的username 一定与前面的Owner 一致,记住你的username下面会用到

WX20170527-124416

2.安装hexo

Hexo 可以说是目前最流行的博客框架了,基于Nodejs,更多信息可以google,下面需要安装的工具包括 Git,Nodejs,Hexo

  1. 安装git

    1
    2
    3
    // 如果已安装HomeBrew 无需执行此行
    $ /usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"
    $ brew install git // 安装Git
  2. 安装Node.js

  3. Homebrew 安装方式,此安装方式无需重启

    1
    2
    3
    4
    $ brew install nvm  
    $ mkdir ~/.nvm
    $ echo "export NVM_DIR=~/.nvm" >> .bash_profile
    $ echo ". $(brew --prefix nvm)/nvm.sh" >> .bash_profile
  4. 重启终端,生效

  5. nvm help 验证nvm是否正确安装
  6. 安装Node.js

    1
    $ nvm install 4
  7. 安装Hexo

1
$ sudo npm install hexo-cli -g

编写博客,发布到线上

接下来通过Hexo初始化博客

创建博客

将命令中的username换成你自己的username,注意和github上username保持一致,执行成功后会创建出一个名为username.github.io的文件夹(/Users/wuming目录下)

1
$ hexo init username.github.io

更改配置

主题

Hexo有更多主题

1
2
$ cd username.github.io
$ git clone https://github.com/iissnan/hexo-theme-next themes/next

基础配置

打开username.github.io的文件夹中的_config.yml文件,修改几个键值对并保存,键值之间之间一定要有空格,否则发布时报错. 更多设置

1
2
3
4
5
6
7
title: dimsky 的 9 维空间    //你博客的名字
author: dimsky //你的名字
language: zh-Hans //语言 中文
theme: next //刚刚安装的主题名称
deploy:
type: git //使用Git 发布
repo: https://github.com/username/username.github.io.git // 刚创建的Github仓库

主题配置
主题配置文件在username.github.io/themes/next/_config.yml中修改。设置详情

3.写文章

在username.github.io/source/_posts下创建你的第一个博客吧,例如,创建一个名为HelloWorld.md的文件,用Markdown大肆发挥吧,注意保存

测试

运行命令后,可以在浏览器中输入https://localhost:4000 访问了,注意关掉全局翻墙哦!

1
2
$ hexo s
安装部署发布工具
1
$ npm install hexo-deployer-git --save

发布

如果是第一次,终端会让输入GitHub的账号和密码,正确输入后,博客会传至GitHub仓库中,进入仓库中查看提交记录,正确提交后,就可以线上进入自己的博客地址啦!

1
$ hexo clean && hexo g && hexo d