hexo简单上手

hexo简单上手

1. 新建仓库

gi github 新建一个仓库,仓库名必须为 <user-name>.github.io 格式,其中 <user-name> 是你 github 的昵称。

2. 全局安装hexo

可以配置cnpm

1
2
npm install -g cnpm --registry=https://registry.npm.taobao.org
cnpm install -g hexo

3. 初始化项目

Just one 命令,hexo init,就会自动构建一个 hexo 项目,紧接着执行 hexo s,浏览器访问 localhost:4000 就可以看到效果啦!

1
2
3
4
hexo init

// 本地运行
hexo s

4. 部署到github

虽然只有一份 Hello World,但是我也想让全世界的人看到,成为最闪耀的那个崽,可咋整?不要慌,快速在项目根目录下找到 _congif.yml,找到 deploy 字段并填写完整,本身配置的yml文件:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
# Hexo Configuration
## Docs: https://hexo.io/docs/configuration.html
## Source: https://github.com/hexojs/hexo/

# Site
title: 磊迹
subtitle: '热爱可抵岁月漫长'
description: '业精于勤,荒于嬉;行成于思,毁于随'
keywords:
author: Lei Zhou
language: zh-Hans
timezone: Asia/Shanghai

# URL
## If your site is put in a subdirectory, set url as 'http://yoursite.com/child' and root as '/child/'
url: http://yoursite.com
root: /
permalink: :title/
permalink_defaults:
pretty_urls:
trailing_index: true # Set to false to remove trailing 'index.html' from permalinks
trailing_html: true # Set to false to remove trailing '.html' from permalinks

# Directory
source_dir: source
public_dir: public
tag_dir: tags
archive_dir: archives
category_dir: categories
code_dir: downloads/code
i18n_dir: :lang
skip_render: README.md

# Writing
new_post_name: :title.md # File name of new posts
default_layout: post
titlecase: false # Transform title into titlecase
external_link:
enable: true # Open external links in new tab
field: site # Apply to the whole site
exclude: ''
filename_case: 0
render_drafts: false
post_asset_folder: false
relative_link: false
future: true
highlight:
enable: true
line_number: true
auto_detect: true
tab_replace: ''
wrap: true
hljs: false

# 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: 15
order_by: -date

# Category & Tag
default_category: uncategorized
category_map:
tag_map:

# Metadata elements
## https://developer.mozilla.org/en-US/docs/Web/HTML/Element/meta
meta_generator: true

# 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-DD
time_format: HH:mm:ss
## Use post's date for updated date unless set in front-matter
use_date_for_updated: false

# Pagination
## Set per_page to 0 to disable pagination
per_page: 10
pagination_dir: page

#归档设置
archive_generator:
per_page: 30 #归档页每页博客数
yearly: true
monthly: true
#标签页
tag_generator:
per_page: 20

# Search
search:
path: ./public/search.xml
field: post
format: html
limit: 10000

# Include / Exclude file(s)
## include:/exclude: options only apply to the 'source/' folder
include:
exclude:
ignore:

# Extensions
## Plugins: https://hexo.io/plugins/
## Themes: https://hexo.io/themes/
theme: next

# Deployment
## Docs: https://hexo.io/docs/deployment.html
deploy:
type: git
repo:
githab: git@github.com:zlleige/zlleige.github.io.git,master
gitcafe: git@e.coding.net:zlleige/zlleige/zlleige.git,master
gittee: git@gitee.com:zlleige/zlleige.git,master
# branch: master


live2d:
enable: true
scriptFrom: local
pluginRootPath: live2dw/
pluginJsPath: lib/
pluginModelPath: assets/
tagMode: false
model:
use: live2d-widget-model-wanko #选择哪种模型
display: #放置位置和大小
position: right
width: 150
height: 300
mobile:
show: false #是否在手机端显示

# Extensions
## Plugins: http://hexo.io/plugins/
#plugins: hexo-generate-feed

symbols_count_time:
symbols: true
time: true
total_symbols: true
total_time: true


# hexo-tag-cloud
tag_cloud:
textFont: Trebuchet MS, Helvetica
textColor: '#333'
textHeight: 25
outlineColor: '#E2E1D1'
maxSpeed: 0.1

抄写完毕!但是!我们需要额外的一个工具来帮助我们推到仓库上,那就是!那就是!那就是 hexo-deployer-git。搞它!

1
npm install hexo-deployer-git --save

万事俱备,只欠东南风!执行下面两个命令,就可以把项目自动部署到 github 上啦啦啦啦啦。

1
2
3
hexo clean

hexo g -d

git@e.coding.net:zlleige/zlleige.git

5 运行报错

1
2
3
ERROR Cannot find module 'hexo' from 'F:\hexo'
ERROR Local hexo loading failed in F:\hexo
ERROR Try running: 'rm -rf node_modules && npm install --force'

直接在根目录运行:

1
cnpm install

6 hexo 展示图片

1、引入插件

1
npm install https://github.com/xcodebuild/hexo-asset-image

2、修改_config.yml中的post_asset_folder设为true

3、typera 设置自定义图片文件夹和文件同名

引用:

简书

7 hexo备份

hexo 备份

hexo b

创作不易,欢迎打赏!
-------------本文结束感谢您的阅读-------------