热门标签 | HotTags
当前位置:  开发笔记 > 编程语言 > 正文

Hexo个人免费博客(一)从零到发布Github

之前使用过jekyll+github做过一版自己的博客网站,有兴趣的可以看一下我之前的文章:http:blog.csdn.netlinshuhe1articledetai

之前使用过jekyll+github做过一版自己的博客网站,有兴趣的可以看一下我之前的文章:http://blog.csdn.net/linshuhe1/article/details/51143026,其实也很简单,但是存在一些问题:目录、Rss、sitemap无法自动生成。


最近看到了别人使用hexo+github实现的博客,有更多的灵活性和简约的风格,所以也试着改一下自己原本的设计。
参考资料:
- EZLippi-浮生志:Jekyll迁移到Hexo搭建个人博客
- iissnan的Next主题:Next使用文档

什么是hexo:

hexo是一个基于Node.js的静态博客程序,可以方便的生成静态网页托管到github或者Heroku上,类似于jekyll、Octopress、Wordpress等,使用markdown来写文章。hexo的作者是https://github.com/tommy351/hexo。具有以下几点优点:

  • 易用性,部署很简单,常用指令有:hexo newhexo generatehexo serverhexo deploy
  • 轻量级,文件少而小,自定义方便

相关知识:

hexo配置过程中使用到了GithubGitMarkdownNode.js等相关操作,所以需要很多插件、widget需要自己安装配置。

安装准备:

  1. Node.js:https://nodejs.org/en/ ;
  2. Github桌面版(Windows):https://desktop.github.com/;

安装Github桌面版和配置

  1. 双击下载好的GitHubSetup.exe文件,按照默认设置完成安装;
  2. 登录自己的github账号;
  3. 在github网页上创建一个以username.github.io命名的repositories,此时username为自己github的账号名称;
  4. 打开Git Shell,使用配置SSH Key使本地git项目与远程Github建立联系:ssh -T git@github.com

安装Node.js

直接双击下载好的node-v4.5.0-x64.msi选择指定的安装路径,按照默认设置完成安装操作,安装完成后不需要对Node.js进行任何配置。为了检验是否完成安装,可以打开命令行,输入指令:npm --version进行版本号查询。

安装Hexo:

1.安装:

mkdir hexo #创建一个项目文件
cd hexo #进入项目文件目录
npm install -g hexo-cli
npm install hexo --save

npm是Node.js中的一个工具,所以在安装Hexo之前应该先安装Node.js

2.部署Hexo:

在Git shell中输入:

hexo init

记得输入之前需要确保当前命令行所处目录为所要创建工程的根目录下,因为此操作的结果就是将hexo的一些必要文件复制到当前目录下面。

看到上图结果之后,可以通过以下指令运行博客:

hexo server


运行正常的话可以通过访问:http://localhost:4000/查看运行结果:

假如出现了hexo服务启动成功,但是浏览器访问localhost:4000一直不响应,那就有可能是因为你的设备上装了其他软件占用了4000端口,一般有两种办法可以解决:

  • 在服务管理中将占用该端口的服务停止掉,通常安装了福昕阅读器的就会占用4000,把其对应的后台服务关掉即可;
  • 切换hexo启动的默认端口,使用以下指令:
    hexo s -p 5000

此时启动端口就变成了5000,访问地址变成了localhost:5000。

3.安装Hexo插件:

主要目的是为了让其自动生成sitemap,Rss,部署到git等,这些是额外的插件,假如不需要使用到这些功能可以不添加:

npm install hexo-generator-index --save
npm install hexo-generator-archive --save
npm install hexo-generator-category --save
npm install hexo-generator-tag --save
npm install hexo-server --save
npm install hexo-deployer-git --save
npm install hexo-deployer-heroku --save
npm install hexo-deployer-rsync --save
npm install hexo-deployer-openshift --save
npm install hexo-renderer-marked@0.2 --save
npm install hexo-renderer-stylus@0.2 --save
npm install hexo-generator-feed@1 --save
npm install hexo-generator-sitemap@1 --save

将当前工程上传到github

1.修改配置文件:

在当前项目的根目录下找到_config.yml配置文件,用编辑器打开,并找到Deployment标签处deploy节点,填写以下配置信息,type是指定拖过平台类型,repository指定了github上创建的repository仓库地址,branch指定了版本类型。(注:冒号后面需要加一个空格,否则会出现报错)

# Deployment
## Docs: https://hexo.io/docs/deployment.html
deploy:
type: github
repository: https://github.com/linshuhe1/linshuhe1.github.io.git
branch: master

2.将项目deploy到github仓库:

打开Git shell进入当前项目的根目录,依次执行指令:

hexo clean
hexo generate
hexo deploy

一般执行最后一步的时候会出现错误如下:

解决错误的方法是:将deploy的type改成git,然后在Git shell中执行:

npm install hexo-deployer-git --save

执行结束后再次执行上述三个指令,正确结果应该如下:

如此我们便完成了将本地的hexo工程deploy到github上的操作,访问地址:https://username.github.io/可以看到页面效果,这里以我的github为例:https://linshuhe1.github.io/。


推荐阅读
author-avatar
诸葛二蛋
这个家伙很懒,什么也没留下!
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有