Star

MIT License
Copyright © 2020
CONNECT-platform

linkMiscellaneous Config

The misc config property can be used to configure external integrations. CODEDOC ships with integrations with GitHub and Gitter, respectively configurable via github and gitter properties:

.codedoc/config.ts
1import { configuration } from '@codedoc/core';

2

3//...

4

5export const config = /*#__PURE__*/configuration({

6 //...

7 misc: {

8 github: {

9 user: 'johndoe', // --> name of the user on GitHub owning the repo

10 repo: 'my-project', // --> name of the repo on GitHub

11 action: 'Fork', // --> action of the GitHub button

12 count: false, // --> whether to show the `count` on the GitHub button

13 large: true, // --> whether to show a `large` GitHub button

14 standardIcon: false, // --> whether to use the GitHub icon on the GitHub button or use an action specific icon

15 },

16 gitter: {

17 room: 'johndoe/my-project' // --> id of the Gitter room for the project

18 }

19 },

20 //...

21});


linkGitHub Integration

The GitHub integration includes the standard GitHub button in the header, a link to the repo in the footer and GitHub search functionality. You can configure this integration via github property:

.codedoc/config.ts
1import { configuration } from '@codedoc/core';

2

3//...

4

5export const config = /*#__PURE__*/configuration({

6 //...

7 misc: {

8 github: {

9 user: 'johndoe', // --> name of the user on GitHub owning the repo

10 repo: 'my-project', // --> name of the repo on GitHub

11 action: 'Issue', // --> action of the GitHub button

12 count: true, // --> whether to show the `count` on the GitHub button

13 large: true, // --> whether to show a `large` GitHub button

14 standardIcon: true, // --> whether to use the GitHub icon on the GitHub button or use an action specific icon

15 },

16 //...

17 },

18 //...

19});


linkSeparate Docs Repo

If you are using a seperate repository for your documentation, you would want to configure the GitHub integration to point at your main repository, while having the GitHub search functionality look into your documentation repository.

Imagine your main repository is my-project and its documentation repository is my-project-docs, all owned by the user johndoe.


STEP 1
Configure .codedoc/config.ts to point to my-project:

.codedoc/config.ts
1import { configuration } from '@codedoc/core';

2

3//...

4

5export const config = /*#__PURE__*/configuration({

6 //...

7 misc: {

8 github: {

9 user: 'johndoe',

10 repo: 'my-project',

11 //...

12 },

13 //...

14 },

15 //...

16});


STEP 2
Configure the search functionality (via .codedoc/content/index.tsx) to use my-project-docs instead:

.codedoc/content/intex.tsx
1import { RendererLike } from '@connectv/html';

2import { File } from 'rxline/fs';

3import { Page, Meta, ContentNav, Fonts, ToC, GithubSearch$ } from '@codedoc/core/components';

4

5import { config } from '../config';

6import { Header } from './header';

7import { Footer } from './footer';

8

9

10export function content(_content: HTMLElement, toc: HTMLElement, renderer: RendererLike<any, any>, file: File<string>) {

11 return (

12 <Page title={config.page.title.extractor(_content, config, file)}

13 favicon={config.page.favicon}

14 meta={<Meta {...config.page.meta}/>}

15 fonts={<Fonts {...config.page.fonts}/>}

16

17 scripts={config.page.scripts}

18 stylesheets={config.page.stylesheets}

19

20 header={<Header {...config}/>}

21 footer={<Footer {...config}/>}

22 toc={

23 <ToC search={

24 config.misc?.github ?

25 <GithubSearch$

26 repo="my-project-docs" // --> change this line

27 user={config.misc.github.user}

28 root={config.src.base}

29 pick={config.src.pick.source}

30 drop={config.src.drop.source}

31 /> : false

32 }>{toc}</ToC>

33 }>

34 {_content}

35 <ContentNav content={_content}/>

36 </Page>

37 )

38}


linkGitter Integration

The Gitter integration will include the Gitter side-car on your docs page, activatable via the Community link in the footer (click on the Community link on the footer of this page to see how it looks):

.codedoc/config.ts
1import { configuration } from '@codedoc/core';

2

3//...

4

5export const config = /*#__PURE__*/configuration({

6 //...

7 misc: {

8 gitter: {

9 room: 'johndoe/my-project' // --> id of the Gitter room for the project

10 }

11 },

12 //...

13});

Miscellaneous ConfigGitHub IntegrationSeparate Docs RepoGitter Integration

Home Overview CLI Theme

Markdownchevron_right
Code Featureschevron_right

Images & Assets

Configurationchevron_right
Customizationchevron_right