Skip to content

Commit 855c450

Browse files
committed
feat(emoji): add emoji plugin
1 parent 2521c58 commit 855c450

14 files changed

+322
-165
lines changed

build/build.js

+2-1
Original file line numberDiff line numberDiff line change
@@ -33,7 +33,8 @@ build({
3333

3434
var plugins = [
3535
{ name: 'search', entry: 'search/index.js', moduleName: 'Search' },
36-
{ name: 'ga', entry: 'ga.js', moduleName: 'GA' }
36+
{ name: 'ga', entry: 'ga.js', moduleName: 'GA' },
37+
{ name: 'emoji', entry: 'emoji.js', moduleName: 'Emoji' }
3738
// { name: 'front-matter', entry: 'front-matter/index.js', moduleName: 'FrontMatter' }
3839
]
3940

docs/README.md

+1-1
Original file line numberDiff line numberDiff line change
@@ -15,6 +15,7 @@ See the [Quick start](/quickstart) for more details.
1515
- Smart full-text search plugin
1616
- Multiple themes
1717
- Useful plugin API
18+
- Emoji support
1819
- Compatible with IE10+
1920

2021
## Examples
@@ -24,4 +25,3 @@ Check out the [Showcase](https://github.com/QingWei-Li/docsify/#showcase) to doc
2425
## Donate
2526

2627
Please consider donating if you think docsify is helpful to you or that my work is valuable. I am happy if you can help me [buy a cup of coffee](https://github.com/QingWei-Li/donate). :heart:
27-

docs/_sidebar.md

+2-1
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,8 @@
77
- Customization
88
- [Configuration](/configuration)
99
- [Themes](/themes)
10-
- [Using plugins](/plugins)
10+
- [List of Plugins](/plugins)
11+
- [Write a Plugin](/write-a-plugin)
1112
- [Markdown configuration](/markdown)
1213
- [Lanuage highlighting](/language-highlight)
1314

docs/plugins.md

+7-72
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,6 @@
1-
# Using plugins
1+
# List of Plugins
22

3-
## List of Plugins
4-
5-
### Full text search
3+
## Full text search
64

75
By default, the hyperlink on the current page is recognized and the content is saved in `localStorage`. You can also specify the path to the files.
86

@@ -38,7 +36,7 @@ By default, the hyperlink on the current page is recognized and the content is s
3836
```
3937

4038

41-
### Google Analytics
39+
## Google Analytics
4240

4341
Install the plugin and configure the track id.
4442

@@ -60,75 +58,12 @@ Configure by `data-ga`.
6058
<script src="//unpkg.com/docsify/lib/plugins/ga.js"></script>
6159
```
6260

61+
## emoji
6362

64-
## Write a plugin
65-
66-
A plugin is simply a function that takes `hook` as arguments.
67-
The hook supports handling asynchronous tasks.
68-
69-
#### Full configuration
70-
71-
```js
72-
window.$docsify = {
73-
plugins: [
74-
function (hook, vm) {
75-
hook.init(function() {
76-
// Called when the script starts running, only trigger once, no arguments,
77-
})
63+
The default is to support parsing emoji. For example `:100:` will be parsed to :100:. But it is not precise because there is no matching non-emoji string. If you need to correctly parse the emoji string, you need install this plugin.
7864

79-
hook.beforeEach(function(content) {
80-
// Invoked each time before parsing the Markdown file.
81-
// ...
82-
return content
83-
})
8465

85-
hook.afterEach(function(html, next) {
86-
// Invoked each time after the Markdown file is parsed.
87-
// beforeEach and afterEach support asynchronous。
88-
// ...
89-
// call `next(html)` when task is done.
90-
next(html)
91-
})
92-
93-
hook.doneEach(function() {
94-
// Invoked each time after the data is fully loaded, no arguments,
95-
// ...
96-
})
97-
98-
hook.mounted(function() {
99-
// Called after initial completion. Only trigger once, no arguments.
100-
})
101-
102-
hook.ready(function() {
103-
// Called after initial completion, no arguments.
104-
})
105-
}
106-
]
107-
}
66+
```html
67+
<script src="//unpkg.com/docsify/lib/plugins/emoji.js"></script>
10868
```
10969

110-
!> You can get internal methods through `window.Docsify`. Get the current instance through the second argument.
111-
112-
#### Example
113-
114-
Add footer component in each pages.
115-
116-
```js
117-
window.$docsify = {
118-
plugins: [
119-
function (hook) {
120-
var footer = [
121-
'<hr/>',
122-
'<footer>',
123-
'<span><a href="https://github.com/QingWei-Li">cinwell</a> &copy;2017.</span>',
124-
'<span>Proudly published with <a href="https://github.com/QingWei-Li/docsify" target="_blank">docsify</a>.</span>',
125-
'</footer>'
126-
].join('')
127-
128-
hook.afterEach(function (html) {
129-
return html + footer
130-
})
131-
}
132-
]
133-
}
134-
```

docs/quickstart.md

+1-5
Original file line numberDiff line numberDiff line change
@@ -76,7 +76,7 @@ You should set the `data-app` attribute if you changed `el`:
7676

7777
```html
7878
<!-- index.html -->
79-
79+
8080
<div data-app id="main">Please wait...</div>
8181

8282
<script>
@@ -85,7 +85,3 @@ You should set the `data-app` attribute if you changed `el`:
8585
}
8686
</script>
8787
```
88-
89-
## Emoji support
90-
91-
Support [github emoji](https://github.com/scotch-io/All-Github-Emoji-Icons) :smile:

docs/write-a-plugin.md

+71
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,71 @@
1+
# Write a plugin
2+
3+
A plugin is simply a function that takes `hook` as arguments.
4+
The hook supports handling asynchronous tasks.
5+
6+
## Full configuration
7+
8+
```js
9+
window.$docsify = {
10+
plugins: [
11+
function (hook, vm) {
12+
hook.init(function() {
13+
// Called when the script starts running, only trigger once, no arguments,
14+
})
15+
16+
hook.beforeEach(function(content) {
17+
// Invoked each time before parsing the Markdown file.
18+
// ...
19+
return content
20+
})
21+
22+
hook.afterEach(function(html, next) {
23+
// Invoked each time after the Markdown file is parsed.
24+
// beforeEach and afterEach support asynchronous。
25+
// ...
26+
// call `next(html)` when task is done.
27+
next(html)
28+
})
29+
30+
hook.doneEach(function() {
31+
// Invoked each time after the data is fully loaded, no arguments,
32+
// ...
33+
})
34+
35+
hook.mounted(function() {
36+
// Called after initial completion. Only trigger once, no arguments.
37+
})
38+
39+
hook.ready(function() {
40+
// Called after initial completion, no arguments.
41+
})
42+
}
43+
]
44+
}
45+
```
46+
47+
!> You can get internal methods through `window.Docsify`. Get the current instance through the second argument.
48+
49+
## Example
50+
51+
Add footer component in each pages.
52+
53+
```js
54+
window.$docsify = {
55+
plugins: [
56+
function (hook) {
57+
var footer = [
58+
'<hr/>',
59+
'<footer>',
60+
'<span><a href="https://github.com/QingWei-Li">cinwell</a> &copy;2017.</span>',
61+
'<span>Proudly published with <a href="https://github.com/QingWei-Li/docsify" target="_blank">docsify</a>.</span>',
62+
'</footer>'
63+
].join('')
64+
65+
hook.afterEach(function (html) {
66+
return html + footer
67+
})
68+
}
69+
]
70+
}
71+
```

docs/zh-cn/README.md

+1
Original file line numberDiff line numberDiff line change
@@ -16,6 +16,7 @@ docsify 是一个动态生成文档网站的工具。不同于 GitBook、Hexo
1616
- 智能的全文搜索
1717
- 提供多套主题
1818
- 丰富的 API
19+
- 支持 Emoji
1920
- 兼容 IE10+
2021

2122
## 例子

docs/zh-cn/_sidebar.md

+2-1
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,8 @@
77
- 定制化
88
- [配置项](zh-cn/configuration)
99
- [主题](zh-cn/themes)
10-
- [使用插件](zh-cn/plugins)
10+
- [插件列表](zh-cn/plugins)
11+
- [开发插件](zh-cn/write-a-plugin)
1112
- [Markdown 配置](zh-cn/markdown)
1213
- [代码高亮](zh-cn/language-highlight)
1314

docs/zh-cn/plugins.md

+7-71
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,6 @@
1-
# 使用插件
1+
# 插件列表
22

3-
## 内置插件
4-
5-
### 全文搜索 - Search
3+
## 全文搜索 - Search
64

75
全文搜索插件会根据当前页面上的超链接获取文档内容,在 `localStorage` 内建立文档索引。默认过期时间为一天,当然我们可以自己指定需要缓存的文件列表或者配置过期时间。
86

@@ -37,7 +35,7 @@
3735
<script src="//unpkg.com/docsify/lib/plugins/search.js"></script>
3836
```
3937

40-
### 谷歌统计 - Google Analytics
38+
## 谷歌统计 - Google Analytics
4139

4240
需要配置 track id 才能使用。
4341

@@ -58,72 +56,10 @@
5856
<script src="//unpkg.com/docsify/lib/plugins/ga.js"></script>
5957
```
6058

61-
## 自定义插件
62-
63-
docsify 提供了一套插件机制,其中提供的钩子(hook)支持处理异步逻辑,可以很方便的扩展功能。
64-
65-
#### 完整功能
66-
67-
```js
68-
window.$docsify = {
69-
plugins: [
70-
function (hook, vm) {
71-
hook.init(function() {
72-
// 初始化时调用,只调用一次,没有参数。
73-
})
74-
75-
hook.beforeEach(function(content) {
76-
// 每次开始解析 Markdown 内容时调用
77-
// ...
78-
return content
79-
})
80-
81-
hook.afterEach(function(html, next) {
82-
// 解析成 html 后调用。beforeEach 和 afterEach 支持处理异步逻辑
83-
// ...
84-
// 异步处理完成后调用 next(html) 返回结果
85-
next(html)
86-
})
87-
88-
hook.doneEach(function() {
89-
// 每次路由切换时数据全部加载完成后调用,没有参数。
90-
// ...
91-
})
92-
93-
hook.mounted(function() {
94-
// 初始化完成后调用 ,只调用一次,没有参数。
95-
})
96-
97-
hook.ready(function() {
98-
// 初始化并第一次加完成数据后调用,没有参数。
99-
})
100-
}
101-
]
102-
}
103-
```
104-
105-
!> 如果需要用 docsify 的内部方法,可以通过 `window.Docsify` 获取,通过 `vm` 获取当前实例。
59+
## emoji
10660

107-
#### 例子
61+
默认是提供 emoji 解析的,能将类似 `:100:` 解析成 :100:。但是它不是精准的,因为没有处理非 emoji 的字符串。如果你需要正确解析 emoji 字符串,你可以引入这个插件。
10862

109-
给每个页面的末尾加上 `footer`
110-
111-
```js
112-
window.$docsify = {
113-
plugins: [
114-
function (hook) {
115-
var footer = [
116-
'<hr/>',
117-
'<footer>',
118-
'<span><a href="https://github.com/QingWei-Li">cinwell</a> &copy;2017.</span>',
119-
'<span>Proudly published with <a href="https://github.com/QingWei-Li/docsify" target="_blank">docsify</a>.</span>',
120-
'</footer>'
121-
].join('')
122-
123-
hook.afterEach(function (html) {
124-
return html + footer
125-
})
126-
}
127-
]
128-
}
63+
```html
64+
<script src="//unpkg.com/docsify/lib/plugins/emoji.js"></script>
12965
```

docs/zh-cn/pwa.md

+1-1
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@
44
要使用它也非常容易。
55

66
## 创建 serviceWorker
7-
这里已经整理好了一份代码,你只需要在网站根目录下创建一个 `sw.js` 文件,并张贴下面的代码
7+
这里已经整理好了一份代码,你只需要在网站根目录下创建一个 `sw.js` 文件,并粘贴下面的代码
88

99
*sw.js*
1010

docs/zh-cn/quickstart.md

-5
Original file line numberDiff line numberDiff line change
@@ -81,8 +81,3 @@ cd docs && python -m SimpleHTTPServer 3000
8181
}
8282
</script>
8383
```
84-
85-
## Emoji 支持
86-
87-
自动转义 [github 支持的 emoji](https://github.com/scotch-io/All-Github-Emoji-Icons):smile:
88-

0 commit comments

Comments
 (0)