From eeb02d64803f54b3efd5350615a941113ff147b1 Mon Sep 17 00:00:00 2001 From: Jon McClure Date: Thu, 6 Jul 2023 17:15:35 +0100 Subject: [PATCH 1/2] update recommended mdx extension --- .vscode/extensions.json | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/.vscode/extensions.json b/.vscode/extensions.json index b2c8b0b2..9661c455 100644 --- a/.vscode/extensions.json +++ b/.vscode/extensions.json @@ -1,3 +1,5 @@ { - "recommendations": ["silvenon.mdx"] + "recommendations": [ + "unifiedjs.vscode-mdx" + ] } From f60e9ad640c510cee042159be4659c8b273b347c Mon Sep 17 00:00:00 2001 From: Jon McClure Date: Thu, 6 Jul 2023 17:25:15 +0100 Subject: [PATCH 2/2] add gfm to mdx docs --- .storybook/main.ts | 21 ++++++++++++++++++++- package.json | 3 ++- 2 files changed, 22 insertions(+), 2 deletions(-) diff --git a/.storybook/main.ts b/.storybook/main.ts index 6eaa0dbb..5b768a0c 100644 --- a/.storybook/main.ts +++ b/.storybook/main.ts @@ -1,10 +1,29 @@ import type { StorybookConfig } from '@storybook/svelte-vite'; +import remarkGfm from 'remark-gfm'; const config: StorybookConfig = { stories: ['../src/**/*.mdx', '../src/**/*.stories.@(js|jsx|ts|tsx|svelte)'], addons: [ '@storybook/addon-links', - '@storybook/addon-essentials', + '@storybook/addon-actions', + '@storybook/addon-viewport', + { + name: '@storybook/addon-docs', + options: { + csfPluginOptions: null, + jsxOptions: {}, + mdxPluginOptions: { + mdxCompileOptions: { + remarkPlugins: [remarkGfm], + }, + }, + }, + }, + '@storybook/addon-controls', + '@storybook/addon-backgrounds', + '@storybook/addon-toolbars', + '@storybook/addon-measure', + '@storybook/addon-outline', '@storybook/addon-interactions', '@storybook/addon-svelte-csf', ], diff --git a/package.json b/package.json index 733b39dc..97e7e270 100644 --- a/package.json +++ b/package.json @@ -70,6 +70,7 @@ "react": "^18.2.0", "react-dom": "^18.2.0", "react-syntax-highlighter": "^15.5.0", + "remark-gfm": "^3.0.1", "rimraf": "^5.0.0", "sass": "^1.63.0", "storybook": "^7.0.20", @@ -245,4 +246,4 @@ ".": "./dist/index.js" }, "svelte": "./dist/index.js" -} \ No newline at end of file +}