import{_ as l}from"./chunks/PageInfo.vue_vue_type_script_setup_true_lang.250b3e56.js";import{_ as e,o,c as p,H as t,k as s,a,Q as c}from"./chunks/framework.b7580407.js";import"./chunks/commonjsHelpers.725317a4.js";const k=JSON.parse('{"title":"Config","description":"You can configure Twoslash to change code example output.","frontmatter":{"description":"You can configure Twoslash to change code example output.","title":"Config"},"headers":[],"relativePath":"application/vitepress-plugin-shiki-twoslash/config/reference.md","filePath":"application/vitepress-plugin-shiki-twoslash/config/reference.md","lastUpdated":1695144785000}'),r={name:"application/vitepress-plugin-shiki-twoslash/config/reference.md"},i=s("h1",{id:"config",tabindex:"-1"},[a("Config "),s("a",{class:"header-anchor",href:"#config","aria-label":'Permalink to "Config"'},"​")],-1),d=s("h2",{id:"overview",tabindex:"-1"},[a("Overview "),s("a",{class:"header-anchor",href:"#overview","aria-label":'Permalink to "Overview"'},"​")],-1),y=s("p",null,[a("You can configure VitePress Twoslash using the "),s("code",null,"twoslash"),a(" property added to "),s("code",null,"defineConfig"),a(".")],-1),h=s("div",{class:"language-ts vp-adaptive-theme line-numbers-mode"},[s("button",{title:"Copy Code",class:"copy"}),s("span",{class:"lang"},"ts"),s("pre",{class:"shiki solarized-dark twoslash lsp",style:{"background-color":"#002B36",color:"#839496"}},[s("div",{class:"language-id"},"ts"),s("div",{class:"code-container"},[s("code",null,[s("div",{class:"line"},[s("span",{style:{color:"#586E75"}},"// .vitepress/config.[ext]")]),s("div",{class:"line"},[s("span",{style:{color:"#859900"}},"import"),s("span",{style:{color:"#839496"}}," { "),s("span",{style:{color:"#268BD2"}},[s("data-lsp",{lsp:`(alias) function defineConfig(config: UserConfig): UserConfig import defineConfig`},"defineConfig")]),s("span",{style:{color:"#839496"}}," } "),s("span",{style:{color:"#859900"}},"from"),s("span",{style:{color:"#839496"}}," "),s("span",{style:{color:"#2AA198"}},"'vitepress'")]),s("div",{class:"line"},[s("span",{style:{color:"#859900"}},"import"),s("span",{style:{color:"#839496"}}," { "),s("span",{style:{color:"#268BD2"}},[s("data-lsp",{lsp:`(alias) function withTwoslash(config: UserConfig): Promise> import withTwoslash`},"withTwoslash")]),s("span",{style:{color:"#839496"}},", "),s("span",{style:{color:"#268BD2"}},[s("data-lsp",{lsp:`(alias) type TwoslashConfigSettings = any import TwoslashConfigSettings`},"TwoslashConfigSettings")]),s("span",{style:{color:"#839496"}}," } "),s("span",{style:{color:"#859900"}},"from"),s("span",{style:{color:"#839496"}}," "),s("span",{style:{color:"#2AA198"}},"'@andatoshiki/vitepress-plugin-shiki-twoslash'")]),s("div",{class:"line"}," "),s("div",{class:"line"},[s("span",{style:{color:"#859900"}},"export"),s("span",{style:{color:"#839496"}}," "),s("span",{style:{color:"#859900"}},"default"),s("span",{style:{color:"#839496"}}," "),s("span",{style:{color:"#268BD2"}},[s("data-lsp",{lsp:`(alias) withTwoslash(config: UserConfig): Promise> import withTwoslash`},"withTwoslash")]),s("span",{style:{color:"#839496"}},"(")]),s("div",{class:"line"},[s("span",{style:{color:"#839496"}}," "),s("span",{style:{color:"#268BD2"}},[s("data-lsp",{lsp:`(alias) defineConfig(config: UserConfig): UserConfig import defineConfig`},"defineConfig")]),s("span",{style:{color:"#839496"}},"({")]),s("div",{class:"line"},[s("span",{style:{color:"#839496"}},[a(" "),s("data-lsp",{lsp:"(property) UserConfig.twoslash?: any"},"twoslash"),a(": {")])]),s("div",{class:"line"},[s("span",{style:{color:"#839496"}}," "),s("span",{style:{color:"#586E75"}},"// Your VitePress Twoslash options")]),s("div",{class:"line"},[s("span",{style:{color:"#839496"}}," },")]),s("div",{class:"line"},[s("span",{style:{color:"#839496"}}," })")]),s("div",{class:"line"},[s("span",{style:{color:"#839496"}},")")])])])]),s("pre",{class:"shiki solarized-light twoslash lsp",style:{"background-color":"#FDF6E3",color:"#657B83"}},[s("div",{class:"language-id"},"ts"),s("div",{class:"code-container"},[s("code",null,[s("div",{class:"line"},[s("span",{style:{color:"#93A1A1"}},"// .vitepress/config.[ext]")]),s("div",{class:"line"},[s("span",{style:{color:"#859900"}},"import"),s("span",{style:{color:"#657B83"}}," { "),s("span",{style:{color:"#268BD2"}},[s("data-lsp",{lsp:`(alias) function defineConfig(config: UserConfig): UserConfig import defineConfig`},"defineConfig")]),s("span",{style:{color:"#657B83"}}," } "),s("span",{style:{color:"#859900"}},"from"),s("span",{style:{color:"#657B83"}}," "),s("span",{style:{color:"#2AA198"}},"'vitepress'")]),s("div",{class:"line"},[s("span",{style:{color:"#859900"}},"import"),s("span",{style:{color:"#657B83"}}," { "),s("span",{style:{color:"#268BD2"}},[s("data-lsp",{lsp:`(alias) function withTwoslash(config: UserConfig): Promise> import withTwoslash`},"withTwoslash")]),s("span",{style:{color:"#657B83"}},", "),s("span",{style:{color:"#268BD2"}},[s("data-lsp",{lsp:`(alias) type TwoslashConfigSettings = any import TwoslashConfigSettings`},"TwoslashConfigSettings")]),s("span",{style:{color:"#657B83"}}," } "),s("span",{style:{color:"#859900"}},"from"),s("span",{style:{color:"#657B83"}}," "),s("span",{style:{color:"#2AA198"}},"'@andatoshiki/vitepress-plugin-shiki-twoslash'")]),s("div",{class:"line"}," "),s("div",{class:"line"},[s("span",{style:{color:"#859900"}},"export"),s("span",{style:{color:"#657B83"}}," "),s("span",{style:{color:"#859900"}},"default"),s("span",{style:{color:"#657B83"}}," "),s("span",{style:{color:"#268BD2"}},[s("data-lsp",{lsp:`(alias) withTwoslash(config: UserConfig): Promise> import withTwoslash`},"withTwoslash")]),s("span",{style:{color:"#657B83"}},"(")]),s("div",{class:"line"},[s("span",{style:{color:"#657B83"}}," "),s("span",{style:{color:"#268BD2"}},[s("data-lsp",{lsp:`(alias) defineConfig(config: UserConfig): UserConfig import defineConfig`},"defineConfig")]),s("span",{style:{color:"#657B83"}},"({")]),s("div",{class:"line"},[s("span",{style:{color:"#657B83"}},[a(" "),s("data-lsp",{lsp:"(property) UserConfig.twoslash?: any"},"twoslash"),a(": {")])]),s("div",{class:"line"},[s("span",{style:{color:"#657B83"}}," "),s("span",{style:{color:"#93A1A1"}},"// Your VitePress Twoslash options")]),s("div",{class:"line"},[s("span",{style:{color:"#657B83"}}," },")]),s("div",{class:"line"},[s("span",{style:{color:"#657B83"}}," })")]),s("div",{class:"line"},[s("span",{style:{color:"#657B83"}},")")])])])]),s("div",{class:"line-numbers-wrapper","aria-hidden":"true"},[s("span",{class:"line-number"},"1"),s("br")])],-1),u=c(`

INFO

In addition to the below config options, VitePress Twoslash also supports all shiki HighlighterOptions and @typescript/twoslash TwoSlashOptions.

Options

addTryButton

A way to turn on the try buttons seen on the TS website.

  • Type: boolean
  • Default: false
ts
export default withTwoslash(
    defineConfig({
        twoslash: {
            addTryButton: true, 
        },
    })
)
export default withTwoslash(
    defineConfig({
        twoslash: {
            addTryButton: true, 
        },
    })
)

alwayRaiseForTwoslashExceptions

Instead of showing twoslash exceptions inline, throw the entire process like it will on CI.

  • Type: boolean
  • Default: false
ts
export default withTwoslash(
    defineConfig({
        twoslash: {
            alwayRaiseForTwoslashExceptions: true, 
        },
    })
)
export default withTwoslash(
    defineConfig({
        twoslash: {
            alwayRaiseForTwoslashExceptions: true, 
        },
    })
)

disableImplicitReactImport

A way to disable implicit React imports on tsx/jsx language codeblocks

  • Type: boolean
  • Default: false
ts
export default withTwoslash(
    defineConfig({
        twoslash: {
            disableImplicitReactImport: true, 
        },
    })
)
export default withTwoslash(
    defineConfig({
        twoslash: {
            disableImplicitReactImport: true, 
        },
    })
)

includeJSDocInHover

Include JSDoc comments in the hovers.

  • Type: boolean
  • Default: false
ts
export default withTwoslash(
    defineConfig({
        twoslash: {
            includeJSDocInHover: true, 
        },
    })
)
export default withTwoslash(
    defineConfig({
        twoslash: {
            includeJSDocInHover: true, 
        },
    })
)

ignoreCodeblocksWithCodefenceMeta

Ignore transforming certain code blocks.

  • Type: boolean
  • Default: false
ts
export default withTwoslash(
    defineConfig({
        twoslash: {
            ignoreCodeblocksWithCodefenceMeta: true, 
        },
    })
)
export default withTwoslash(
    defineConfig({
        twoslash: {
            ignoreCodeblocksWithCodefenceMeta: true, 
        },
    })
)

wrapFragments

A way to add a div wrapper for multi-theme outputs.

  • Type: boolean
  • Default: false
ts
export default withTwoslash(
    defineConfig({
        twoslash: {
            wrapFragments: true, 
        },
    })
)
export default withTwoslash(
    defineConfig({
        twoslash: {
            wrapFragments: true, 
        },
    })
)
`,26);function f(g,m,b,B,w,v){const n=l;return o(),p("div",null,[i,t(n,{readTime:"1",words:"248"}),d,y,h,u])}const x=e(r,[["render",f]]);export{k as __pageData,x as default};