hexo+github搭建博客

2018-11-05  本文已影响9人  _52Hertz

前言

不管简书、掘金或者其他网站,总会感觉不是自己的地盘,所以我就想自己搭建个博客,可以在自己的一亩三分地上耕耘收获。不仅如此,以往我写的博客都会到处乱放,比如一会放到掘金,一会放到简书等等,不利于管理,搭建一个自己的博客也更方便了个人的整理分类。目前来说,hexo还是挺主流的一种搭建博客的方式,主题也很多,可以供各位选择。先给大家看下我的博客

myblog

Hexo介绍

Hexo 是一个快速、简洁且高效的博客框架。Hexo 使用 Markdown(或其他渲染引擎)解析文章,在几秒内,即可利用靓丽的主题生成静态网页。

安装Git

我之前有写过安装Git的教程,可点击查看,在这里我就不再赘述了。

安装NodeJs

Hexo是基于nodeJS环境的静态博客,里面的npm工具真的很有用啊,不管之后的安装hexo、统计阅读时长、博文字数或者添加小萌妹都需要使用到npm工具,所以还是老老实实的装上吧~

  1. 基本上都是64位的,直接给上64位Windows的下载地址:https://nodejs.org/dist/v10.13.0/node-v10.13.0-x64.msi
    或者自己自行到官网下载:https://nodejs.org/en/
  2. 下载好msi文件后,双击打开安装,反正一路next,安装路径可以根据自己需要更改。
  3. 安装完之后打开cmd窗口(win+r),查看nodejs安装的版本。
    输入以下命令:
$ node -v
$ npm -v
node版本

安装成功!

安装Hexo

Hexo安装就只需要npm工具就行了
npm可以设置淘宝NPM镜像,来提高下载速度

$ npm install -g cnpm --registry=https://registry.npm.taobao.org
  1. 创建一个空的文件夹
  2. 打开Git Bash(安装完Git随处右击就有“Git Bash here”),cd到文件夹,也可以直接在文件夹内右击“Git Bash here”
  3. 安装Hexo
$ npm install -g hexo-cli
hexo安装
  1. 查看hexo版本
$ hexo -v
查看版本
  1. 初始化
$ hexo init
初始化

看一下文件夹初始化后内容


文件夹

解析一下各文件:

  1. 查看本地博客
    启动本地服务
$ hexo s

访问本地浏览器:http://localhost:4000

本地博客

写博客

  1. 创建.md文件,目录:/source/_posts


    第一篇博客
  2. 博文的属性


    属性
---
title: hexo-blog
date: 2018-11-03 16:07:32
tags: 
---

这里要说一下 tags 这个属性,如果需要配置多个有两种方式:

tags: [tag1, tag2, tag3]

或者

tags:
  - tag1
  - tag2
  - tag3

注:Hexo 是支持 Markdown 的所有功能的,所以,最好去学习一下 Markdown 的语法规范。

搭桥到GitHub

  1. 没有GitHub账号创建账号,有的话就看下一步
  2. 创建新的仓库repository


    新仓库

    其中Repository name必须是你的github名称,不然后续会报404错误。


    create
  3. 回到gitbash中,配置github账户信息(YourName和YourEail都替换成你自己的)
  4. 创建SSH
    第3,4步我之前的博文有教程,这里就不再详细描述操作过程了,你也可以找度娘搜索。
  5. 修改_config.yml文件
deploy:
  type: git
  repo: https://github.com/yourGitHubName/yourGitHubName.github.io.git
  branch: master

注意:冒号之后都是有一个半角空格的,没有的话会出错!

  1. 安装hexo-deployer-git自动部署发布工具
$ npm install hexo-deployer-git  --save
  1. 发布到Github,命令如下:
$ hexo clean
$ hexo generate
$ hexo deploy

第一次上传是需要验证GitHub账号的


验证

当出现下图字样表示发布成功


成功
  1. 访问:http://yourGitHubName.github.io
    注:感觉GitBash中东西太多的时候可以输入clear来清空命令。
上一篇下一篇

猜你喜欢

热点阅读