使用GitHub+Hexo快速搭建个人技术博客
前言
前几天使用github+hexo配合网络教程搭建了一个个人博客,遇到了一些问题。现在完整记下来,希望下次绕过这些坑。
本人博客:[五谷山精分道长的博客](https://huruwo.github.io/)
搭建博客步骤
- 注册Github账号
- 建立仓库名为username.github.io的仓库
- 安装Git/Github桌面版
- Git和Github设置密钥关联起来(使用Github桌面半不需要,只需要登录即可)
- 安装Node.js
- 使用Node.js安装npm 再用npm安卓hexo
- 配置hexo,主要是github地址填写
- hexo g生成所需静态页面
- hexo deploy上传到git --大功告成
下面详细解释一下这些步骤:
注册GitHub账号
前往Github主页https://github.com/ 点击注册,按要
求填写邮箱密码用户名即可。注意用户名和你的gityhub地址有关,注意填写。最后进行邮箱认证。
新建仓库
点击New Repository
建立新的仓库。
跳转到新的界面,填写仓库名 “username”.github.io。
比如我的是huruwo.github.io
。
确定。
安装Git/Github桌面版
我建议安装github桌面版,自带gitshell
安装地址为https://desktop.github.com/
可能下载速度慢,学会科学上网。或者下载离线包GitHub离线安装包
下载完,点击安装即可。
最后出现这两个图标:
点击GitHub,登录自己的GitHub账号
就能看到自己的仓库了。其实这已经配置好Sh密钥了。
不信点击自己的Github账号 setting--SSHKey
有了github就不要再次安装其他git工具了,直接可以在内部找到github的git.exe写入环境变量即可。
安装Node.js
百度 Node.js 进入官网下载安装
安装npm
npm是Node.js自动的包管理插件,通过npm可以下载安装nodejs的模块包。这和Python一样。
版本查看
C:\Users\Administrator>node -v
v6.9.1
C:\Users\Administrator>npm -v
3.10.8
安装hexo
打开命令行-->
npm install -g hexo
如果没有翻墙,会出现错误
需要设置代理
npm config set registry http://registry.cnpmjs.org
npm install express --registry=https://registry.npm.taobao.org
删除刚刚安装的npm目录,
或者执行
npm cache clean
删除缓存
重新执行命令npm install -g hexo安装hexo
创建Hexo工程文件
在你喜欢的地方新建一个Hexo文件夹,作为hexo的安装目录
shift+右键--->在当前位置打开命令行
初始化
hexo init
创建网站,开启服务
hexo generate
hexo server
现在我们已经搭建起本地的hexo博客了,到浏览器输入localhost:4000看看。
配置hexo,主要是github地址填写
打开配置文件_config.yml,修改最后一行:
配置仓库地址:
deploy:
type: git
repository: 仓库地址
branch: master
记得地址是带.git
然后:
hexo deploy
如果失败,请先安装git模块
npm install hexo -server --save
如果出错可改为(添加:--registry https://registry.npm.taobao.org
)
npm --registry https://registry.npm.taobao.org install hexo -server --save
没有出错即
INFO Deploy done: git
可完成,现在输入你的
username.github.io即可访问你的网站。
其他:
部署步骤
每次部署的步骤,可按以下三步来进行。
hexo clean
hexo generate
hexo deploy
一些常用命令:
hexo new "postName" #新建文章
hexo new page "pageName" #新建页面
hexo generate #生成静态页面至public目录
hexo server #开启预览访问端口(默认端口4000,'ctrl + c'关闭server)
hexo deploy #将.deploy目录部署到GitHub
hexo help #查看帮助
hexo version #查看Hexo的版本
全局配置 _config.yml
title: #标题
subtitle: #副标题
description: #站点描述,给搜索引擎看的
author: #作者
email: #电子邮箱
language: zh-CN #语言
# URL #链接格式
url: #网址
root: / #根目录
permalink: :year/:month/:day/:title/ #文章的链接格式
tag_dir: tags #标签目录
archive_dir: archives #存档目录
category_dir: categories #分类目录
code_dir: downloads/code
permalink_defaults:
# Directory #目录
source_dir: source #源文件目录
public_dir: public #生成的网页文件目录
# Writing #写作
new_post_name: :title.md #新文章标题
default_layout: post #默认的模板,包括 post、page、photo、draft(文章、页面、照片、草稿)
titlecase: false #标题转换成大写
external_link: true #在新选项卡中打开连接
filename_case: 0
render_drafts: false
post_asset_folder: false
relative_link: false
highlight: #语法高亮
enable: true #是否启用
line_number: true #显示行号
tab_replace:
# Category & Tag #分类和标签
default_category: uncategorized #默认分类
category_map:
tag_map:
# Archives
2: 开启分页
1: 禁用分页
0: 全部禁用
archive: 2
category: 2
tag: 2
# Server #本地服务器
port: 4000 #端口号
server_ip: localhost #IP 地址
logger: false
logger_format: dev
# Date / Time format #日期时间格式
date_format: YYYY-MM-DD #参考http://momentjs.com/docs/#/displaying/format/
time_format: H:mm:ss
# Pagination #分页
per_page: 10 #每页文章数,设置成 0 禁用分页
pagination_dir: page
# Disqus #Disqus评论,替换为多说
disqus_shortname:
# Extensions #拓展插件
theme: landscape-plus #主题
exclude_generator:
plugins: #插件,例如生成 RSS 和站点地图的
- hexo-generator-feed
- hexo-generator-sitemap
# Deployment #部署,将 lmintlcx 改成用户名
deploy:
type: git
repo: 刚刚github创库地址.git
branch: master
主题推荐
Next-----
具体使用查看文档