gridsome-plugin-gitalk v0.4.0
Gridsome Plugin Gitalk
A plugin that simplifies adding Gitalk comments to Gridsome.
Installation
# For npm
$ npm install gridsome-plugin-gitalk
# For yarn
$ yarn add gridsome-plugin-gitalk
Tutorial
Refer to this blog for a detailed tutorial on how to use and configure this plugin.
Usage
Add this plugin to your gridsome.config.js
plugins: [
{
use: 'gridsome-plugin-gitalk',
options: {
clientID: '',
... // Gitalk config
}
}
]
Then simply add the following line to your Vue files.
<Gitalk />
You can also specify options in the component itself like.
<Gitalk :config={
id: 'hi',
...
} />
Note: If same option is specified in the
gridsome.config.js
and the component. The value in the component would be considered.
Config Options
clientID
String
Required. GitHub Application Client ID.
clientSecret
String
Required. GitHub Application Client Secret.
repo
String
Required. GitHub repository.
owner
String
Required. GitHub repository owner. Can be personal user or organization.
admin
Array
Required. GitHub repository owner and collaborators. (Users who having write access to this repository)
id
String
Default:
location.href
.The unique id of the page. Length must less than 50.
number
Number
Default:
-1
.The issue ID of the page, if the
number
attribute is not defined, issue will be located usingid
.labels
Array
Default:
['Gitalk']
.GitHub issue labels.
title
String
Default:
document.title
.GitHub issue title.
body
String
Default:
location.href + header.meta[description]
.GitHub issue body.
language
String
Default:
navigator.language || navigator.userLanguage
.Localization language key,
en
,zh-CN
andzh-TW
are currently available.perPage
Number
Default:
10
.Pagination size, with maximum 100.
distractionFreeMode
Boolean
Default: false.
Facebook-like distraction free mode.
pagerDirection
String
Default: 'last'
Comment sorting direction, available values are
last
andfirst
.createIssueManually
Boolean
Default:
false
.By default, Gitalk will create a corresponding github issue for your every single page automatically when the logined user is belong to the
admin
users. You can create it manually by setting this option totrue
.proxy
String
Default:
https://cors-anywhere.herokuapp.com/https://github.com/login/oauth/access_token
.GitHub oauth request reverse proxy for CORS. Why need this?
flipMoveOptions
Object
Default:
{ staggerDelayBy: 150, appearAnimation: 'accordionVertical', enterAnimation: 'accordionVertical', leaveAnimation: 'accordionVertical', }
Comment list animation. Reference
enableHotKey
Boolean
Default:
true
.Enable hot key (cmd|ctrl + enter) submit comment.
License (MIT)
Open LICENSE file for more info