Skip to content
This repository was archived by the owner on May 13, 2024. It is now read-only.

Commit d6bfae3

Browse files
committed
feat: spread out blog plugin options to theme options (close #34) (#48)
1 parent dd6bb0d commit d6bfae3

File tree

8 files changed

+1721
-71
lines changed

8 files changed

+1721
-71
lines changed

.eslintrc.js

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,8 @@ module.exports = {
22
root: true,
33

44
env: {
5-
"node": true
5+
"node": true,
6+
"jest": true
67
},
78

89
extends: [

docs/config/README.md

Lines changed: 161 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@ prev: /
66
## dateFormat
77

88
- Type: `string`
9-
- Default: 'ddd MMM DD YYYY'
9+
- Default: `'ddd MMM DD YYYY'`
1010

1111
The [date](./front-matter.md#date) will be displayed in the layout with this format.
1212
You can find all available formats [here](https://github.com/iamkun/dayjs/blob/dev/docs/en/API-reference.md#displaying)
@@ -119,9 +119,160 @@ module.exports = {
119119
}
120120
```
121121

122-
## modifyBlogPluginOptions
122+
## directories
123123

124-
A function used to modify the default blog plugin options of [@vuepress/plugin-blog](https://vuepress-plugin-blog.ulivz.com/).
124+
- Type: `DirectoryClassifier[]`
125+
- Default: `See below`
126+
127+
```JavaScript
128+
[
129+
{
130+
id: 'post',
131+
dirname: '_posts',
132+
path: '/',
133+
},
134+
]
135+
```
136+
137+
By default, pages are placed in `_post`, and the path for post list is `/`. Here's an example if you wish to customize it:
138+
139+
```JavaScript
140+
[
141+
{
142+
id: 'writing', // Unique id for current classifier
143+
dirname: '_writings', // Matched directory name
144+
path: '/writings/', // Entry page for current classifier
145+
title: '隨筆' // Entry and pagination page titles for current classifier.
146+
layout: 'IndexWriting', // Layout component name for entry page.
147+
frontmatter:{ //Front matter for entry page.
148+
tag: 'vuepress'
149+
}
150+
itemLayout: 'Writing', // Layout for matched pages.
151+
itemPermalink: '/writings/:year/:month/:day/:slug', // Permalink for matched pages.
152+
pagination: { // Pagination behavior
153+
lengthPerPage: 2,
154+
},
155+
}
156+
]
157+
```
158+
159+
Reference:
160+
- [document classifiers](https://vuepress-plugin-blog.ulivz.com/guide/getting-started.html#document-classifier)
161+
162+
## frontmatters
163+
164+
- Type: `FrontmatterClassifier[]`
165+
- Default: `See below`
166+
167+
```JavaScript
168+
[
169+
{
170+
id: 'tag',
171+
keys: ['tag', 'tags'],
172+
path: '/tag/',
173+
},
174+
]
175+
```
176+
177+
Only `tag` and `tags` in front matter will be classified, and the path for it is `'/tag/'` by default. Let's see how to customize it:
178+
179+
```JavaScript
180+
[
181+
{
182+
id: 'location', // Unique id for current classifier
183+
keys: ['location'], // Frontmatter keys used to classify pages
184+
path: '/location/', // Entry page for current classifier
185+
title: '地點', // Entry, scope and pagination page titles for current classifier.
186+
layout: 'IndexLocation', // Layout component name for entry page.
187+
scopeLayout: 'ScopeLocation', // Layout component name for scope page.
188+
frontmatter: { //Front matter for entry page.
189+
description: 'Hello'
190+
},
191+
pagination: { // Pagination behavior
192+
lengthPerPage: 2,
193+
},
194+
},
195+
]
196+
```
197+
Reference:
198+
- [Frontmatter Classifier](https://vuepress-plugin-blog.ulivz.com/guide/getting-started.html#frontmatter-classifier)
199+
## globalPagination
200+
201+
- Type: `object`
202+
- Default: `{ lengthPerPage: 5 }`
203+
204+
Pagination config for all directories and frontmatters. For example:
205+
206+
```JavaScript
207+
{
208+
prevText:'下一頁', // Text for previous links.
209+
nextText:'上一頁', // Text for next links.
210+
lengthPerPage:'2', // Maximum number of posts per page.
211+
layout:'Pagination', // Layout for pagination page
212+
}
213+
```
214+
215+
For more information, please visit [Pagination Config](https://vuepress-plugin-blog.ulivz.com/pagination/#sorter).
216+
## sitemap
217+
218+
- Type: `object`
219+
- Default: `undefined`
220+
221+
You can simply enable it by filling out `hostname` property with your host name:
222+
223+
```JavaScript
224+
{
225+
hostname: 'https://yourdomain'
226+
}
227+
```
228+
229+
Please head [vuepress-plugin-sitemap](https://github.com/ekoeryanto/vuepress-plugin-sitemap#options) for more details.
230+
231+
## comment
232+
233+
- Type: `object`
234+
- Default: `undefined`
235+
236+
Vssue and Disqus are our built-in comment services. Here's the required properties to enable:
237+
238+
```JavaScript
239+
// Disqus
240+
{
241+
service: "disqus",
242+
shortname: "Your blog's shortname",
243+
}
244+
245+
// Vssue
246+
{
247+
service: 'vssue',
248+
owner: 'You',
249+
repo: 'Your repo',
250+
clientId: 'Your clientId',
251+
clientSecret: 'Your clientSecret',
252+
}
253+
```
254+
Further configuration, please visit:
255+
- [vuepress-plugin-disqus-comment](https://vuepress-plugin-disqus.netlify.com/#usage)
256+
- [vuepress-plugin-vssue](https://vssue.js.org/guide/vuepress.html#usage)
257+
258+
## newsletter
259+
260+
- Type: `object`
261+
- Default: `undefined`
262+
263+
Mailchimp is our default newsletter service. The only required property to enable newsletter is `endpoint`:
264+
265+
```JavaScript
266+
{
267+
endpoint: 'https://billyyyyy3320.us4.list-manage.com/subscribe/post?u=4905113ee00d8210c2004e038&id=bd18d40138'
268+
}
269+
```
270+
271+
Please head [vuepress-plugin-mailchimp](https://vuepress-plugin-mailchimp.billyyyyy3320.com/#config) to see how to get your `endpoint`.
272+
273+
## modifyBlogPluginOptions <Badge text="Not recommended" type="warning"/>
274+
275+
A function used to modify the blog plugin options of [@vuepress/plugin-blog](https://vuepress-plugin-blog.ulivz.com/). It'll override not only default options but also the six options above (`directories`, `frontmatters`, `globalPagination`, `sitemap`, `comment`, `newsletter`).
125276

126277
Here's the default blog plugin options:
127278

@@ -132,26 +283,18 @@ Here's the default blog plugin options:
132283
id: 'post',
133284
dirname: '_posts',
134285
path: '/',
135-
// layout: 'IndexPost', defaults to `Layout.vue`
136-
itemLayout: 'Post',
137-
itemPermalink: '/:year/:month/:day/:slug',
138-
pagination: {
139-
lengthPerPage: 5,
140-
},
141286
},
142287
],
143288
frontmatters: [
144289
{
145-
id: "tag",
290+
id: 'tag',
146291
keys: ['tag', 'tags'],
147292
path: '/tag/',
148-
// layout: 'Tag', defaults to `FrontmatterKey.vue`
149-
frontmatter: { title: 'Tag' },
150-
pagination: {
151-
lengthPerPage: 5
152-
}
153293
},
154-
]
294+
],
295+
globalPagination: {
296+
lengthPerPage: 5,
297+
},
155298
}
156299
```
157300

@@ -170,7 +313,7 @@ module.exports = {
170313
itemLayout: 'Writing',
171314
itemPermalink: '/writings/:year/:month/:day/:slug',
172315
pagination: {
173-
perPagePosts: 5,
316+
lengthPerPage: 5,
174317
},
175318
}
176319

@@ -250,7 +393,7 @@ plugin is as follows:
250393
## paginationComponent
251394

252395
- Type: `string`
253-
- Default: `Pagination`
396+
- Default: `'Pagination'`
254397

255398
Custom the pagination component.
256399

example/.vuepress/config.js

Lines changed: 86 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,9 @@ module.exports = {
66
/**
77
* Ref: https://vuepress-theme-blog.ulivz.com/#dateFormat
88
*/
9-
dateFormat: 'YYYY-MM-DD',
9+
10+
// dateFormat: 'YYYY-MM-DD',
11+
1012
/**
1113
* Ref: https://vuepress-theme-blog.ulivz.com/#nav
1214
*/
@@ -21,8 +23,8 @@ module.exports = {
2123
// link: '/tag/',
2224
// },
2325
// {
24-
// text: 'About',
25-
// link: '/about/',
26+
// text: 'Location',
27+
// link: '/location/',
2628
// },
2729
// ],
2830

@@ -88,29 +90,89 @@ module.exports = {
8890
],
8991
},
9092
/**
91-
* Ref: https://vuepress-theme-blog.ulivz.com/#modifyblogpluginoptions
93+
* Ref: https://vuepress-theme-blog.ulivz.com/#directories
94+
*/
95+
96+
// directories:[
97+
// {
98+
// id: 'post',
99+
// dirname: '_posts',
100+
// path: '/',
101+
// itemPermalink: '/:year/:month/:day/:slug',
102+
// },
103+
// {
104+
// id: 'writing',
105+
// dirname: '_writings',
106+
// path: '/',
107+
// itemPermalink: '/:year/:month/:day/:slug',
108+
// },
109+
// ],
110+
111+
/**
112+
* Ref: https://vuepress-theme-blog.ulivz.com/#frontmatters
113+
*/
114+
115+
// frontmatters: [
116+
// {
117+
// id: "tag",
118+
// keys: ['tag', 'tags'],
119+
// path: '/tag/',
120+
// },
121+
// {
122+
// id: "location",
123+
// keys: ['location'],
124+
// path: '/location/',
125+
// },
126+
// ],
127+
128+
/**
129+
* Ref: https://vuepress-theme-blog.ulivz.com/#globalPagination
130+
*/
131+
132+
// globalPagination: {
133+
// lengthPerPage: 10,
134+
// },
135+
136+
/**
137+
* Ref: https://vuepress-theme-blog.ulivz.com/#sitemap
92138
*/
93-
modifyBlogPluginOptions (blogPluginOptions) {
94-
const sitemap = {
95-
hostname: 'https://yourdomain'
96-
}
97-
98-
const comment = {
99-
service: 'disqus',
100-
shortname: 'vuepress-plugin-blog',
101-
// service: 'vssue',
102-
// owner: 'You',
103-
// repo: 'Your repo',
104-
// clientId: 'Your clientId',
105-
// clientSecret: 'Your clientSecret',
106-
}
107-
108-
const newsletter = {
109-
endpoint:'https://billyyyyy3320.us4.list-manage.com/subscribe/post?u=4905113ee00d8210c2004e038&amp;id=bd18d40138'
110-
}
111-
112-
return { ...blogPluginOptions, sitemap, comment, newsletter }
139+
sitemap: {
140+
hostname: 'https://yourdomain'
113141
},
142+
/**
143+
* Ref: https://vuepress-theme-blog.ulivz.com/#comment
144+
*/
145+
comment: {
146+
service: 'disqus',
147+
shortname: 'vuepress-plugin-blog',
148+
},
149+
/**
150+
* Ref: https://vuepress-theme-blog.ulivz.com/#newsletter
151+
*/
152+
newsletter: {
153+
endpoint: 'https://billyyyyy3320.us4.list-manage.com/subscribe/post?u=4905113ee00d8210c2004e038&amp;id=bd18d40138'
154+
}
155+
/**
156+
* Ref: https://vuepress-theme-blog.ulivz.com/#modifyblogpluginoptions
157+
*/
158+
159+
// modifyBlogPluginOptions (blogPluginOptions) {
160+
// const sitemap = {
161+
// hostname: 'https://yourdomain'
162+
// }
163+
164+
// const comment = {
165+
// service: 'disqus',
166+
// shortname: 'vuepress-plugin-blog',
167+
// }
168+
169+
// const newsletter = {
170+
// endpoint:'https://billyyyyy3320.us4.list-manage.com/subscribe/post?u=4905113ee00d8210c2004e038&amp;id=bd18d40138'
171+
// }
172+
173+
// return { ...blogPluginOptions, sitemap, comment, newsletter }
174+
// },
175+
114176
/**
115177
* Ref: https://vuepress-theme-blog.ulivz.com/#summary
116178
*/

0 commit comments

Comments
 (0)