1 | # gatsby-source-kibela
|
2 |
|
3 | [![npm version](https://img.shields.io/npm/v/gatsby-source-kibela.svg)](https://www.npmjs.com/package/gatsby-source-kibela)
|
4 | [![install size](https://packagephobia.now.sh/badge?p=gatsby-source-kibela)](https://packagephobia.now.sh/result?p=gatsby-source-kibela)
|
5 | [![test](https://github.com/shooontan/gatsby-source-kibela/actions/workflows/test.yml/badge.svg)](https://github.com/shooontan/gatsby-source-kibela/actions/workflows/test.yml)
|
6 |
|
7 | Gatsby Source Plugin for [Kibela](https://kibe.la/).
|
8 |
|
9 | ## Install
|
10 |
|
11 | ```sh
|
12 | # npm
|
13 | $ npm install gatsby-source-kibela
|
14 |
|
15 | # or yarn
|
16 | $ yarn add gatsby-source-kibela
|
17 | ```
|
18 |
|
19 | ## Usage
|
20 |
|
21 | ### gatsby-config.js
|
22 |
|
23 | You need setting options in `gatsby-config.js` to fetch contents from Kibela.
|
24 |
|
25 | ```js
|
26 | // gatsby-config.js
|
27 | module.exports = {
|
28 | plugins: [
|
29 | {
|
30 | resolve: 'gatsby-source-kibela',
|
31 | options: {
|
32 | accessToken: 'my/access/token',
|
33 | subDomain: 'blog',
|
34 | },
|
35 | },
|
36 | ],
|
37 | };
|
38 | ```
|
39 |
|
40 | ### gatsby-node.js
|
41 |
|
42 | You can query like the following. Gatsby creates pages based on Kibela contents.
|
43 |
|
44 | ```js
|
45 | // gatsby-node.js
|
46 | exports.createPages = async ({ graphql, actions }) => {
|
47 | const { createPage } = actions;
|
48 | const result = await graphql(
|
49 | `
|
50 | query {
|
51 | allKibelaNote {
|
52 | nodes {
|
53 | id
|
54 | noteId
|
55 | path
|
56 | }
|
57 | }
|
58 | }
|
59 | `
|
60 | );
|
61 |
|
62 | if (result.errors) {
|
63 | reporter.panic(result.errors);
|
64 | }
|
65 |
|
66 | result.data.allKibelaNote.nodes.forEach((node, index) => {
|
67 | createPage({
|
68 | path: `/notes/${node.noteId}`,
|
69 | component: path.resolve('./src/templates/blog-note.js'),
|
70 | context: {
|
71 | slug: node.noteId,
|
72 | },
|
73 | });
|
74 | });
|
75 | };
|
76 | ```
|
77 |
|
78 | ### Options
|
79 |
|
80 | ```js
|
81 | module.exports = {
|
82 | plugins: [
|
83 | {
|
84 | resolve: 'gatsby-source-kibela',
|
85 | options: {
|
86 | /**
|
87 | * The authentication key for Kibela API requests. (Required)
|
88 | *
|
89 | * Type: string
|
90 | **/
|
91 | accessToken: 'YOUR_ACCESS_TOKEN',
|
92 |
|
93 | /**
|
94 | * Subdomain information. (Required)
|
95 | * subdomain.kibe.la
|
96 | *
|
97 | * Type: string
|
98 | **/
|
99 | subDomain: 'subdomain',
|
100 |
|
101 | /**
|
102 | * Graphql API request query. (Required)
|
103 | *
|
104 | * Type: string
|
105 | **/
|
106 | query: `
|
107 | query {
|
108 | notes(last: 100) {
|
109 | nodes {
|
110 | id
|
111 | title
|
112 | content
|
113 | }
|
114 | }
|
115 | }
|
116 | `,
|
117 |
|
118 | /**
|
119 | * This function let Gatsby system where Graphql data nodes is. (Optional)
|
120 | *
|
121 | * Type: function
|
122 | * Default: body => body.data.notes.nodes
|
123 | **/
|
124 | getNodes: body => body.data.group.notes.nodes,
|
125 | },
|
126 | },
|
127 | ],
|
128 | };
|
129 | ```
|