使用Hexo搭建个人博客并部署到码云
使用Hexo搭建个人博客并部署到Gitee Pages
Github Pages或Gitee Pages是什么呢？
Github Pages或者Gitee Pages是一个免费的静态网页托管服务，我们可以使用它来托管博客、项目官网等静态网页。
目前Gitee Pages 支持 Jekyll、Hugo、Hexo编译静态资源。
Jekyll、Hugo、Hexo 是什么？
Jekyll、Hugo、Hexo 是简单的博客形态的静态站点生产机器。它有一个模版目录，其中包含原始文本格式的文档，通过 Markdown 以及 Liquid 转化成一个完整的可发布的静态网站，你可以发布在任何你喜爱的服务器上。Jekyll、Hugo、Hexo 也可以运行在 码云（Gitee.com） Pages 上，也就是说，你可以使用码云的服务来搭建你的仓库页面、博客或者网站，而且是完全免费的。
Jekyll 使用文档：https://www.jekyll.com.cn/docs/home/
Hugo 使用文档：https://gohugo.io/documentation/
Hexo 使用文档：https://hexo.io/docs/
安装基本环境
- Git
- Node.js
- Hexo
npm install -g hexo
初始化项目 -> 配置 -> 部署到码云访问 -> 本地运行
- 在项目预存位置，cmd或者git bash执行如下命令：
hexo init
- 完成后，生成如下文件：
安装样式解析：npm install hexo-renderer-scss --save
hexo中插入pdf(事后证明这玩意有bug,不安此插件也ok)
安装hexo-pdf插件
- hexo-pdf:
- Install
npm install --save hexo-pdf
- pdf链接
{% pdf http://7xov2f.com1.z0.glb.clouddn.com/bash_freshman.pdf %}
- 本地
- {% pdf ./bash_freshman.pdf %}
- <object data="Arthas进阶-讲义.pdf" type="application/pdf" width="100%" height="877px"/>
- Google drive
{% pdf https://drive.google.com/file/d/0B6qSwdwPxPRdTEliX0dhQ2JfUEU/preview %}
- Slideshare
{% pdf http://www.slideshare.net/slideshow/embed_code/key/8Jl0hUt2OKUOOE %}
- 修改站点配置文件 _config.yml
可参考Hexo官网提供文档进行修改：https://hexo.io/docs/configurationdeploy部署需要安装 hexo-deployer-gitnpm install hexo-deployer-git --save
- 例子
# Hexo Configuration## Docs: https://hexo.io/docs/configuration.html## Source: https://github.com/hexojs/hexo/# Sitetitle: xx的个人博客subtitle: xx's blogdescription: Hello,here is xx's blog.keywords:author: xxlanguage:timezone:search: path: search.xml## post代表仅搜索博客文章，page代表搜索页面，all代表全部搜索 field: post format: html limit: 10000# URL## If your site is put in a subdirectory, set url as 'http://yoursite.com/child' and root as '/child/'url: 码云blog地址root: /blog/permalink: :year/:month/:day/:title/permalink_defaults:# Directorysource_dir: sourcepublic_dir: publictag_dir: tagsarchive_dir: archivescategory_dir: categoriescode_dir: downloads/codei18n_dir: :langskip_render:# Writingnew_post_name: :title.md # File name of new postsdefault_layout: posttitlecase: false # Transform title into titlecaseexternal_link: true # Open external links in new tabfilename_case: 0render_drafts: falsepost_asset_folder: falserelative_link: falsefuture: truehighlight: enable: true line_number: true auto_detect: false tab_replace: # Home page setting# path: Root path for your blogs index page. (default = '')# per_page: Posts displayed per page. (0 = disable pagination)# order_by: Posts order. (Order by date descending by default)index_generator: path: '' per_page: 10 order_by: -date# Category & Tagdefault_category: uncategorizedcategory_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-DDtime_format: HH:mm:ss# Pagination## Set per_page to 0 to disable paginationper_page: 10pagination_dir: page# Extensions## Plugins: https://hexo.io/plugins/## Themes: https://hexo.io/themes/theme: landscape# Deployment## Docs: https://hexo.io/docs/deployment.htmldeploy: type: git # repo: xxx # github仓库 repo: xxx # 码云仓库 branch: master message: # 自定义提交消息
插入图片(以支持markdown格式)
1. npm install hexo-asset-image --save2. 修改_config post_asset_folder: true3. 如果通过使用相对路径的常规 markdown 语法 它将不会出现在首页上。正确的引用图片方式是使用下列的标签插件而不是 markdown ：{% asset_img example.jpg avatar %}(相对路径配置,资源文件夹必须和markdown文件有一样的名字)
编译
hexo g
本地运行
hexo s
默认访问端口为4000
部署项目到码云访问
执行如下命令生成静态文件（public文件夹），并提交到码云或github远程仓库上
hexo d
如果修改过文件内容，需要通过如下命令清除已经生成的静态文件，重新生成
hexo clean
修改主题--去官网找主题：https://hexo.io/themes/
1. 安装新主题(hexo-theme-lx)
https://github.com/blleng/hexo-theme-lx/blob/master/README/README.zh.md（详细配置）
npm install hexo-deployer-git --save 安装自动部署发布工具
2. 下载的新主题会放在themes目录下
3. 修改配置
①.修改项目根目录下的 **_config.yml，将theme指定的landscape修改为
②.先下载本地搜索插件npm install hexo-generator-searchdb -s
4. hexo clean && hexo g && hexo d发布（部署到gitee pages）博客
5. hexo clean && hexo g && hexo s本地浏览
写博客
1.hexo new demo #demo为文件名
会生成到 **_posts** 目录下
2.直接在 _posts 目录下手动创建md文件编写
运行git clone 指令获得主题后（假设是NEXT主题），
在theme主题下保存文件夹的名称为：hexo-theme-next-0.4.0那么如果在config里设置的是next，
就会出现这样的WARN，http://localhost:4000/显示的是空白。
只要把theme下的文件夹名称改为next就显示正常了。
