Mac下利用Hexo+GitHub轻松搭建自己的博客

原创 2016年10月23日 15:03:21

今年4月份就在mac下利用hexo搭建了一个博客,因换了一台电脑,项目丢失,需重新安装。

整理一下安装流程:

1.hexo是基于nodejs的,需安装nodejs,安装nodejs最好选择homebrew

2.首先查看电脑是否安装ruby,因为homebrew安装依赖ruby

3.安装顺序:homebrew---->nodejs---->hexo


安装homebrew

ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"

安装nodejs

brew install node

在安装nodejs过程中,提示如下警告:

You have Xcode 8 installed without the CLT;
根据提示进行安装

安装hexo

sudo npm install -g hexo

创建文件夹

mkdir blog
cd blog
hexo init

此时blog文件下出现了很多文件和文件夹,如下图所示:



生成一套静态网页

hexo generate /** 生成一套静态网页 **/
hexo server /** 在服务器上运行 **/

在浏览器上运行http://localhost:4000就能看到如下的网站首页:


撰写博客

进入终端,使用cd命令进入到有Hexo框架的目录里面,输入:

hexo new post "我的第一篇博客"
随后出现如下的消息:

INFO  Created: ~/blog/source/_posts/我的第一篇博客.md
证明创建文章成功,“我的第一篇博客”这个md文件会创建在source/_posts/的文件下。该md文件在自动生成时会带有一些属性:

title:     定义了博文的标题

date:   定义了创作博文的时间

tags:   定义了博文的标签

除了这个三个属性以外我们还可以扩展一些属性:

update:  定义了最后修改的时间

comments:定义能否评论此博文(默认为true)

categories: 定义了博文的种类

配置文件  --  _config.yml说明

Hexo的每一个功能的配置文件都是_config.yml, 具体说明看下面的注解:

# Hexo Configuration
## Docs: https://hexo.io/docs/configuration.html
## Source: https://github.com/hexojs/hexo/

# Site                 ##修改以适应搜索引擎的收录
title: Hexo            ##定义网站的标题
subtitle:              ##定义网站的副标题
description:           ##定义网站的描述
author: jason jwl      ##定义网站的负责人
language:              ##定义网站的语言,默认zh-Hans
timezone:              ##定义网站的时区

# URL
## If your site is put in a subdirectory, set url as 'http://yoursite.com/child' and root as '/child/'
url: http://yoursite.com   ##定义网站访问的域名
root: /      ##定义所在Web文件夹在哪个目录
permalink: :year/:month/:day/:title/  ##定义时间格式
permalink_defaults:

# Directory
source_dir: source   ##定义从哪个文件夹获取博客资料
public_dir: public   ##定义生成静态网站到哪个文件夹

archive_dir: archives
category_dir: categories
code_dir: downloads/code
i18n_dir: :lang
skip_render:

# Writing
new_post_name: :title.md # File name of new posts
default_layout: post
titlecase: false # Transform title into titlecase
external_link: true # Open external links in new tab
filename_case: 0
render_drafts: false
post_asset_folder: false
relative_link: false
future: true
highlight:
  enable: true
  line_number: true
  auto_detect: false
  tab_replace:

# Category & Tag
default_category: uncategorized
category_map:
tag_map:

# Date / Time format
## Hexo uses Moment.js to parse and display date
## You can customize the date format as defined in
## http://momentjs.com/docs/#/displaying/format/
date_format: YYYY-MM-DD
time_format: HH:mm:ss

# Pagination
## Set per_page to 0 to disable pagination
per_page: 10  ##定义每一页多少条博客
pagination_dir: page

# Extensions
## Plugins: https://hexo.io/plugins/
## Themes: https://hexo.io/themes/
theme: landscape  ##定义使用的主题

# Deployment
## Docs: https://hexo.io/docs/deployment.html
deploy:
  type:


注意:

另外修改这些属性时,请注意格式,属性和值要空一个格,比如theme: landscape。


本地同步github

在github上new Repository,并命名为xxxxx.github.io(xxxxx是你github的账号名),然后把本地项目提交到github的远程项目。具体操作步骤可以参考我以前写的一篇博客:http://blog.csdn.net/jasonjwl/article/details/49682217。然后在浏览器上输入xxxxx.github.io就能访问自己的博客了。

同步到github,发现网站访问不了。并且github给我发了一封邮件,如下所示:


经测试不是主题的问题。

个人建议不通过手动同步github,优先考虑通过修改_config.yml让hexo帮助我们同步github,方便快捷,配置如下所示:

deploy:
  type: git
  repo: https://github.com/xxx/xxx.github.io.git
  branch: master
  xxx为个人github的name
配置完后,运行 

hexo deploy
或者

hexo d
如出现以下的错误:

ERROR Deployer not found: git
请运行以下命令进行安装:

npm install hexo-deployer-git --save
再次运行hexo deploy。工程同步成功!

当你增加新的文章或者插件时,可以通过以下三个命令进行同步操作:

hexo clean
hexo generate
hexo deploy











版权声明:本文为博主原创文章,未经博主允许不得转载。

Hexo的安装和使用(mac篇)

前言Hexo 是一个快速、简洁且高效的博客框架。Hexo 使用 Markdown(或其他渲染引擎)解析文章,在几秒内,即可利用靓丽的主题生成静态网页。官方文档传送门。Hexo的安装是个很快速简便的过程...

Mac下利用Hexo+GitHub搭建自己的博客

一、mac下利用hexo搭建一个博客,已有公司git账户 已有公司git账户,就用改配置文件的方式一,如果没有,可以用方式二。 因为git账户默认配置是global的,会相互覆盖,如果不觉得来回切换...

Mac平台打造github上hexo博客全过程

简介人玩博客有三个阶段,一是在平台写,但是写着写着就会发现限制太多。比如前些年,你写个关于goagent的文章就会审核不过.博客流量来了,你想挂个广告之类的也不行。本人是受实名制的影响,在写博客上有顾...

Mac下搭建目前最in的hexo博客

小巫打算把博客迁移到github中,为了让自己成为一名有逼格的程序员,我也是蛮拼的,所以搭建了一个hexo博客,可以尽情装逼,下面把搭建过程整理出来供大家参考。迁移地址:www.devilwwj.co...
  • wwj_748
  • wwj_748
  • 2015年05月21日 20:27
  • 6985

如何搭建个人博客网站(Mac)

一直以为自己记忆力很好,毕业之后才发现,之前需要看一遍就能记住的东西,现在看两三遍才能有印象。而搞技术的,如果不及时的记录下当时的情景,过后很容易就忘记。所以,再次萌生了搭博客、写文章的想法。...

Mac下使用Hexo搭建个人博客

Mac下使用Hexo搭建个人博客Hexo介绍 利用原作者的一句话:A fast,simple&powerful blog framework,powered by Node.js Hex...

Mac下使用Jekyll和github搭建个人博客

安装ruby 安装gem 安装jekyll 安装博客 本地启动博客 部署到github 添加文章 使用主题 绑定域名 About1 安装rubymac自带, 没有则使用brew安装brew insta...
  • alex_my
  • alex_my
  • 2017年02月22日 11:34
  • 1750

mac下如何把项目提交、更新到gitHub上

今天心血来潮,写了一个Demo准备提交到gitHub上,因为第一次,所以对此一窍不通,经过查找资料,终于成功上传。 下面我分享一下我的过程: 第一步首先项目编写完成 第二步首先有github...
  • klshuo
  • klshuo
  • 2015年11月25日 16:20
  • 2363

Mac下Hexo+GitHub搭建博客图文教程

安装Node.js 从官网下载好一步步安装就行了,或者从这下载node-v4.3.1安装,密码: 3n33。 安装Git Xcode自带Git,详细安装方法自行搜索。 安装Hexo Node...
  • gfbgl
  • gfbgl
  • 2016年02月21日 17:10
  • 3056

Mac平台打造github上hexo博客全过程

简介人玩博客有三个阶段,一是在平台写,但是写着写着就会发现限制太多。比如前些年,你写个关于goagent的文章就会审核不过.博客流量来了,你想挂个广告之类的也不行。本人是受实名制的影响,在写博客上有顾...
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:Mac下利用Hexo+GitHub轻松搭建自己的博客
举报原因:
原因补充:

(最多只允许输入30个字)