From 4f077b2261b568b75948d4851e58cbfca3709b5a Mon Sep 17 00:00:00 2001 From: dimitri Date: Thu, 11 Nov 2021 20:24:53 +0100 Subject: [PATCH 1/2] feat(server): add more language - yml,gql,c#,jsonc,java --- .changeset/quick-goats-protect.md | 5 +++++ packages/server/src/mdx.tsx | 8 ++++++++ packages/server/src/remarkShiki.ts | 7 ++++++- 3 files changed, 19 insertions(+), 1 deletion(-) create mode 100644 .changeset/quick-goats-protect.md diff --git a/.changeset/quick-goats-protect.md b/.changeset/quick-goats-protect.md new file mode 100644 index 00000000..a5fd775d --- /dev/null +++ b/.changeset/quick-goats-protect.md @@ -0,0 +1,5 @@ +--- +'@guild-docs/server': patch +--- + +feat(server): add more language - yml,gql,c#,jsonc,java diff --git a/packages/server/src/mdx.tsx b/packages/server/src/mdx.tsx index 35732631..263251b4 100644 --- a/packages/server/src/mdx.tsx +++ b/packages/server/src/mdx.tsx @@ -174,6 +174,14 @@ const MdxDeps = LazyPromise(async () => { 'ts', 'graphql', 'swift', + 'java', + 'jsonc', + 'diff', + 'csharp', + 'c#', + 'vue', + 'html', + 'svelte', ], }), import('./remarkShiki').then(v => v.withShiki()), diff --git a/packages/server/src/remarkShiki.ts b/packages/server/src/remarkShiki.ts index 8359fbba..c3839062 100644 --- a/packages/server/src/remarkShiki.ts +++ b/packages/server/src/remarkShiki.ts @@ -9,6 +9,11 @@ export interface Options { ignoreUnknownLanguage?: boolean; } +const LANGUAGE_ALIASES: Record = { + 'gql': 'graphql', + 'yml': 'yaml', +}; + export async function withShiki(): Promise<(options: Options) => Transformer> { const { visit } = await import('unist-util-visit'); @@ -22,7 +27,7 @@ export async function withShiki(): Promise<(options: Options) => Transformer> { const node: { value: string; lang: Lang; type: string } = nodeArg; const lang = ignoreUnknownLanguage && !loadedLanguages.includes(node.lang) ? undefined : node.lang; - const highlighted = highlighter.codeToHtml(node.value, lang); + const highlighted = highlighter.codeToHtml(node.value, lang || LANGUAGE_ALIASES[node.lang]); node.type = 'html'; node.value = highlighted; }; From 1e92e15f0f57d9cb7dcff6ff7e628a7ae7e1ad7a Mon Sep 17 00:00:00 2001 From: PabloSzx Date: Thu, 11 Nov 2021 20:10:12 -0300 Subject: [PATCH 2/2] add graphql syntax highlight in example --- examples/basic/docs/README.mdx | 12 ++++++++++++ 1 file changed, 12 insertions(+) diff --git a/examples/basic/docs/README.mdx b/examples/basic/docs/README.mdx index 995881be..600697ee 100644 --- a/examples/basic/docs/README.mdx +++ b/examples/basic/docs/README.mdx @@ -52,6 +52,18 @@ const getEnveloped = envelop({ }); ``` +```gql +type Query { + hello: String! +} +``` + +```gql +query { + hello +} +``` + #### Heading 4 Volutpat ac tincidunt vitae semper quis lectus. Risus viverra adipiscing at in. Et malesuada fames ac turpis egestas integer eget aliquet. Sed nisi lacus sed viverra tellus in hac habitasse platea. In iaculis nunc sed augue. Ornare massa eget egestas purus viverra accumsan in. Eu mi bibendum neque egestas congue quisque egestas diam. Placerat orci nulla pellentesque dignissim enim. Augue interdum velit euismod in pellentesque. Lobortis elementum nibh tellus molestie nunc non blandit massa enim. Pellentesque elit ullamcorper dignissim cras tincidunt lobortis. Non blandit massa enim nec. Placerat in egestas erat imperdiet. Nisl pretium fusce id velit ut. Urna molestie at elementum eu facilisis sed odio. Maecenas volutpat blandit aliquam etiam erat velit scelerisque. Curabitur vitae nunc sed velit dignissim sodales ut. A cras semper auctor neque vitae tempus quam. Diam volutpat commodo sed egestas egestas. Tempus iaculis urna id volutpat.