JiangXin.info

简体中文

English

简体中文

English

深色模式

github 部署 hexo 备忘 ​

github 部署 hexo 备忘

hexo官网：https://hexo.io/zh-cn/

必要配置 ​

GitHub Pages ​

Git ​

Hexo ​

bash
/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"
bash
$ brew update
$ brew install node
$ node -v
bash
$ sudo npm install npm -g
$ npm -v
bash
$ npm install -g hexo-cli

搭建方法 ​

Hexo 官方文档: https://hexo.io/zh-cn/docs/

bash
$ hexo init blog
bash
$ cd blog
bash
$ npm install
bash
$ hexo generate
bash
$ hexo server

主题 ​

部署 ​

  • _config.yml：
bash
deploy:
  type: git
  repo: 对应仓库的SSH地址（可以在GitHub对应的仓库中复制）
  branch: 分支（User Pages为master，Project Pages为gh-pages）
  • 安装插件，使Hexo部署到GitHub：
bash
$ npm install hexo-deployer-git --save
  • 执行部署：
bash
$ hexo generate
$ hexo deploy
  • 访问：username.github.io

hexo常用命令 ​

bash
npm install hexo -g #安装  
npm update hexo -g #升级  
hexo init #初始化

简写 ​

hexo n "我的博客" == hexo new "我的博客" #新建文章 hexo p == hexo publishhexo g == hexo generate #生成 hexo s == hexo server #启动服务预览 hexo d == hexo deploy #部署

服务器 ​

hexo server #Hexo 会监视文件变动并自动更新，您无须重启服务器。 hexo server -s #静态模式 hexo server -p 5000 #更改端口 hexo server -i 192.168.1.1 #自定义 IP

hexo clean #清除缓存 网页正常情况下可以忽略此条命令 hexo g #生成静态网页 hexo d #开始部署

监视文件变动 ​

hexo generate #使用 Hexo 生成静态文件快速而且简单 hexo generate --watch #监视文件变动

完成后部署 ​

bash
两个命令的作用是相同的
hexo generate --deploy
hexo deploy --generate

hexo deploy -ghexo server -g

草稿 ​

hexo publish [layout] <title>

模版 ​

hexo new "postName" #新建文章 hexo new page "pageName" #新建页面 hexo generate #生成静态页面至public目录 hexo server #开启预览访问端口（默认端口4000，'ctrl + c'关闭server） hexo deploy #将.deploy目录部署到GitHub

hexo new [layout] <title>hexo new photo "My Gallery"hexo new "Hello World" --lang tw

变量描述
layout布局
title标题
date文件建立日期
bash
title: 使用Hexo搭建个人博客
layout: post
date: 2014-03-03 19:07:43
comments: true
categories: Blog
tags: [Hexo]
keywords: Hexo, Blog
description: 生命在于折腾，又把博客折腾到Hexo了。给Hexo点赞。

模版（Scaffold） ​

hexo new photo "My Gallery"

变量描述
layout布局
title标题
date文件建立日期

设置文章摘要 ​

以上是文章摘要 <!--more--> 以下是余下全文

写作 ​

hexo new page <title>

hexo new post <title>

变量描述
:title布局
:year建立的年份（4 位数）
:month建立的月份（2 位数）
:i_month建立的月份（去掉开头的零）
:day建立的日期（2 位数）
:i_day建立的日期（去掉开头的零）

推送到服务器上 ​

hexo n #写文章 hexo g #生成 hexo d #部署 #可与hexo g合并为 hexo d -g

报错 ​

找不到git部署 ​

ERROR Deployer not found: git

解决方法

npm install hexo-deployer-git --save

部署类型设置git ​

hexo 3.0 部署类型不再是 github，/_config.yml 中修改

bash
# Deployment
## Docs: http://hexo.io/docs/deployment.html
deploy:
  type: git
  repository: git@***.github.com:***/***.github.io.git
  branch: master

xcodebuild ​

xcode-select: error: tool 'xcodebuild' requires Xcode, but active developer directory '/Library/Developer/CommandLineTools' is a command line tools instance

npm install bcrypt

RSS不显示 ​

安装RSS插件

npm install hexo-generator-feed --save

开启RSS功能

编辑hexo/_config.yml，添加如下代码：

bash
rss: /atom.xml #rss地址  默认即可

使用 Netlify 持续集成 ​

Netlify is a unified platform that automates your code to create high-performant, easily maintainable sites and web apps.

Netlify 与 Travis CI 等等都是持续集成工具, 但是它更加关注前端, 或者说网站或者 web app 的持续集成与持续部署, 这也是它与其他持续集成工具最大的区别. 我们目前对于 Netlify 的使用也非常简单, 但是这是其他持续集成工具没有的.

优化 ​

添加robots.txt ​

robots.txt是一种存放于网站根目录下的ASCII编码的文本文件，它的作用是告诉搜索引擎此网站中哪些内容是可以被爬取的，哪些是禁止爬取的。robots.txt应该放在站点目录下的source文件中，网站生成后在网站的根目录(站点目录/public/)下。

我的robots.txt文件内容如下

User-agent: *
Allow: /
Allow: /archives/
Allow: /categories/
Allow: /about/

Disallow: /vendors/
Disallow: /js/
Disallow: /css/
Disallow: /fonts/
Disallow: /vendors/
Disallow: /fancybox/

添加sitemap ​

Sitemap即网站地图，它的作用在于便于搜索引擎更加智能地抓取网站。最简单和常见的sitemap形式，是XML文件，在其中列出网站中的网址以及关于每个网址的其他元数据（上次更新时间、更新的频率及相对其他网址重要程度等）。

Step 1: 安装sitemap生成插件 ​

npm install hexo-generator-sitemap --save
npm install hexo-generator-baidu-sitemap --save

Step 2: 编辑站点目录下的_config.yml，添加 ​

# hexo sitemap网站地图
sitemap:
path: sitemap.xml
baidusitemap:
path: baidusitemap.xml

Step 3: 在robots.txt文件中添加 ​

Sitemap: https://jiangxin.info/sitemap.xml
Sitemap: https://jiangxin.info/baidusitemap.xml

NEXT 返回顶部按钮百分比显示 ​

# Scroll percent label in b2t button
scrollpercent: true

创建分类页面 ​

添加一个 分类 页面，并在菜单中显示页面链接。

  1. 新建一个页面，命名为 categories 。命令如下：
 hexo new page categories
  1. 编辑刚新建的页面，将页面的类型设置为 categories ，主题将自动为这个页面显示所有分类。
 title: 分类
 date: 2014-12-22 12:39:04
 type: "categories"

注意：如果有启用多说 或者 Disqus 评论，默认页面也会带有评论。需要关闭的话，请添加字段 comments 并将值设置为 false，如：

 title: 分类
 date: 2014-12-22 12:39:04
 type: "categories"
 comments: false
  1. 在菜单中添加链接。编辑主题的 _config.yml ，将 menu 中的 categories: /categories 注释去掉，如下:
 menu:
   home: /
   categories: /categories
   archives: /archives
   tags: /tags

添加添加RSS ​

  1. 切换到Blog文件夹（hexo init的文件夹）下
cd [Blog]
  1. 安装Hexo插件
 npm install --save hexo-generator-feed
  1. 安装成功之后，编辑Blog/_config.yml文件，在文件末尾添加
# Extensions
## Plugins: http://hexo.io/plugins/
plugins: hexo-generate-feed
  1. 配置主题_config.yml文件，command+f搜索rss，在后面加上/atom.xml
# Set rss to false to disable feed link.
# Leave rss as empty to use site's feed link.
# Set rss to specific value if you have burned your feed already.
rss: /atom.xml //注意：有一个空格
  1. 之后，终端输入hexo s查看效果
hexo s

置顶文章 ​

$ npm uninstall hexo-generator-index --save
$ npm install hexo-generator-index-pin-top --save

在文章的Front-matter中添加top: true即可置顶。 再添加sticky: [number]可以实现在文章标题前增加一个顶针图标，这是NexT主题原先置顶方案（已被废除）的残留。[number]为一个具体数字。 扩展：设置top [num]：数字越大置顶为止越前

域名 ​

待填充