使用hexo+github构建免费静态博客

2018-03-25

手机端查看效果

准备工作

Node.js

hexo 是使用node.js 快速生成静态页

Git

hexo 使用git将生成的靓丽的静态页发布到github上。

使用如下命令看是否安装了git，有会显示git版本，没有请自行安装
1
$ git --version

github

使用github page 提供一个免费的ip地址来展现hexo构建的blog。

在github上创建一个账户，然后创建一个git仓库。在settings中设置git page

设置成功后，会显示你个GitHub Pages 访问地址，你可以通过这个地址访问

Hexo

npm install hexo-cli -g      //安装hexo命令
hexo init                    // 部署hexo，初始化命令
npm install                  // 安装插件命令
目录结构：
    初始化hexo目录
       ├─node_modules       // hexo的插件目录
       ├─scaffolds          // layout模板文件目录，其中的md文件可以添加编辑
       |    ├─draft.md
       |    ├─page.md
       |    └─post.md
       ├─source             // 文章源码目录，该目录下的markdown和html文件均会被hexo处理
       |    |                // 该页面对应repo的根目录，404文件、favicon.ico文件，CNAME文件等都应该
       |    └─_posts        // 发布文章
       ├─themes             // 主题文件目录
       |    └─landscape     // hexo初始化默认提供的模板，改模板时就是将需要的模板放到此目录
       ├─.gitignore         // git的忽略规则文件
       ├─_config.yml        // 全局配置文件，大多数的设置都在这里
       └─package.json       // 应用程序数据，指明hexo的版本等信息

新建文章

1	$ hexo new "My New Post"

默认该文章会放在source的_post里。

1	$ hexo new page "photo"

在source文件夹下新建一个photo文件夹

新建文章基于模板

1	$ hexo new [模板名] [title]

More info: Writing

op0=>operation: 清除文件 > hexo clean op1=>operation: 生成静态文件 > hexo generate op2=>operation: 启动服务 > hexo server op4=>operation: 发布服务到Github > hexo deploy op0->op1->op2->op2->op4{"scale":1,"line-width":2,"line-length":50,"text-margin":10,"font-size":12}