mirror of
https://github.com/pengzhanbo/vuepress-theme-plume.git
synced 2026-04-23 10:58:13 +08:00
7 lines
9.9 KiB
JavaScript
7 lines
9.9 KiB
JavaScript
import{B as e,P as t,_ as n,f as r,g as i,h as a,l as o}from"./runtime-core.esm-bundler-CZvn3YaB.js";import{t as s}from"./plugin-vue_export-helper-CxTVcLa7.js";var c=JSON.parse(`{"path":"/guide/code/jsfiddle/","title":"Js Fiddle | 指南","lang":"zh-CN","frontmatter":{"title":"Js Fiddle","icon":"bxl:jsfiddle","createTime":"2024/04/04 10:42:21","permalink":"/guide/code/jsfiddle/","description":"主题支持在 Markdown 文件中嵌入 JS Fiddle。 配置 此功能默认不启用，你可以在配置文件中启用它。 .vuepress/config.ts 语法 简单语法 更多选项 user: 用户 id: jsfiddle id theme: 主题模式， 可选值： "light" | "dark" tab: 选...","head":[["script",{"type":"application/ld+json"},"{\\"@context\\":\\"https://schema.org\\",\\"@type\\":\\"Article\\",\\"headline\\":\\"Js Fiddle\\",\\"image\\":[\\"\\"],\\"dateModified\\":\\"2025-10-07T15:13:09.000Z\\",\\"author\\":[]}"],["meta",{"property":"og:url","content":"https://theme-plume.vuejs.press/guide/code/jsfiddle/"}],["meta",{"property":"og:site_name","content":"Plume 主题"}],["meta",{"property":"og:title","content":"Js Fiddle"}],["meta",{"property":"og:description","content":"主题支持在 Markdown 文件中嵌入 JS Fiddle。 配置 此功能默认不启用，你可以在配置文件中启用它。 .vuepress/config.ts 语法 简单语法 更多选项 user: 用户 id: jsfiddle id theme: 主题模式， 可选值： "light" | "dark" tab: 选..."}],["meta",{"property":"og:type","content":"article"}],["meta",{"property":"og:locale","content":"zh-CN"}],["meta",{"property":"og:locale:alternate","content":"en-US"}],["meta",{"property":"og:updated_time","content":"2025-10-07T15:13:09.000Z"}],["meta",{"property":"article:modified_time","content":"2025-10-07T15:13:09.000Z"}],["link",{"rel":"alternate","hreflang":"en-us","href":"https://theme-plume.vuejs.press/en/guide/code/jsfiddle/"}]]},"readingTime":{"minutes":0.59,"words":178},"git":{"createdTime":1712247346000,"updatedTime":1759849989000,"contributors":[{"name":"pengzhanbo","username":"pengzhanbo","email":"volodymyr@foxmail.com","commits":4,"avatar":"https://avatars.githubusercontent.com/pengzhanbo?v=4","url":"https://github.com/pengzhanbo"}],"changelog":[{"hash":"4d2361a7046214fe0f4e4af01831107fd00e38ad","time":1759849989000,"email":"volodymyr@foxmail.com","author":"pengzhanbo","message":"feat(theme)!: add collections support (#704)"},{"hash":"0fd6cac57412002f4d72dc10378789b529adc357","time":1742063370000,"email":"volodymyr@foxmail.com","author":"pengzhanbo","message":"refactor(theme): improve types and flat config (#524)"},{"hash":"b600e20ba975a55464bd75290ff02cfc66b8f52a","time":1714322245000,"email":"volodymyr@foxmail.com","author":"pengzhanbo","message":"docs: update docs"},{"hash":"4349ab023ca3762f521c33a04301aae39b6c102d","time":1712247346000,"email":"volodymyr@foxmail.com","author":"pengzhanbo","message":"docs: update doc"}]},"autoDesc":true,"filePathRelative":"guide/repl/jsFiddle.md","headers":[],"bulletin":false}`),l={name:`jsFiddle.md`},u={class:`code-block-title`,"data-title":`.vuepress/config.ts`},d={class:`code-block-title-bar`},f={class:`title`};function p(s,c,l,p,m,h){let g=e(`VPIcon`),_=e(`JSFiddleViewer`);return t(),r(`div`,null,[c[2]||=o(`p`,null,[i(`主题支持在 Markdown 文件中嵌入 `),o(`a`,{href:`https://jsfiddle.net/`,target:`_blank`,rel:`noopener noreferrer`},`JS Fiddle`),i(`。`)],-1),c[3]||=o(`h2`,{id:`配置`,tabindex:`-1`},[o(`a`,{class:`header-anchor`,href:`#配置`},[o(`span`,null,`配置`)])],-1),c[4]||=o(`p`,null,`此功能默认不启用，你可以在配置文件中启用它。`,-1),o(`div`,u,[o(`div`,d,[o(`span`,f,[n(g,{provider:`iconify`,name:`vscode-icons:file-type-typescript`}),c[0]||=i(`.vuepress/config.ts`,-1)])]),c[1]||=a(`<div class="language-ts" data-highlighter="shiki" data-ext="ts" style="--shiki-light:#393a34;--shiki-dark:#dbd7caee;--shiki-light-bg:#ffffff;--shiki-dark-bg:#121212;"><pre class="shiki shiki-themes vitesse-light vitesse-dark has-highlighted vp-code"><code class="language-ts"><span class="line"><span style="--shiki-light:#1E754F;--shiki-dark:#4D9375;">export</span><span style="--shiki-light:#1E754F;--shiki-dark:#4D9375;"> default</span><span style="--shiki-light:#59873A;--shiki-dark:#80A665;"> defineUserConfig</span><span style="--shiki-light:#999999;--shiki-dark:#666666;">({</span></span>
|
|
<span class="line"><span style="--shiki-light:#998418;--shiki-dark:#B8A965;"> theme</span><span style="--shiki-light:#999999;--shiki-dark:#666666;">: </span><span style="--shiki-light:#59873A;--shiki-dark:#80A665;">plumeTheme</span><span style="--shiki-light:#999999;--shiki-dark:#666666;">({</span></span>
|
|
<span class="line"><span style="--shiki-light:#998418;--shiki-dark:#B8A965;"> markdown</span><span style="--shiki-light:#999999;--shiki-dark:#666666;">: {</span></span>
|
|
<span class="line highlighted"><span style="--shiki-light:#998418;--shiki-dark:#B8A965;"> jsfiddle</span><span style="--shiki-light:#999999;--shiki-dark:#666666;">: </span><span style="--shiki-light:#1E754F;--shiki-dark:#4D9375;">true</span><span style="--shiki-light:#999999;--shiki-dark:#666666;">, </span></span>
|
|
<span class="line"><span style="--shiki-light:#999999;--shiki-dark:#666666;"> },</span></span>
|
|
<span class="line"><span style="--shiki-light:#999999;--shiki-dark:#666666;"> })</span></span>
|
|
<span class="line"><span style="--shiki-light:#999999;--shiki-dark:#666666;">})</span></span></code></pre></div>`,1)]),c[5]||=a(`<h2 id="语法" tabindex="-1"><a class="header-anchor" href="#语法"><span>语法</span></a></h2><h3 id="简单语法" tabindex="-1"><a class="header-anchor" href="#简单语法"><span>简单语法</span></a></h3><div class="language-md" data-highlighter="shiki" data-ext="md" style="--shiki-light:#393a34;--shiki-dark:#dbd7caee;--shiki-light-bg:#ffffff;--shiki-dark-bg:#121212;"><pre class="shiki shiki-themes vitesse-light vitesse-dark vp-code"><code class="language-md"><span class="line"><span style="--shiki-light:#393A34;--shiki-dark:#DBD7CAEE;">@</span><span style="--shiki-light:#999999;--shiki-dark:#666666;">[</span><span style="--shiki-light:#B56959;--shiki-dark:#C98A7D;">jsfiddle</span><span style="--shiki-light:#999999;--shiki-dark:#666666;">](</span><span style="--shiki-light:#393A3490;--shiki-light-text-decoration:underline;--shiki-dark:#DEDCD590;--shiki-dark-text-decoration:underline;">user/id</span><span style="--shiki-light:#999999;--shiki-dark:#666666;">)</span></span></code></pre></div><h3 id="更多选项" tabindex="-1"><a class="header-anchor" href="#更多选项"><span>更多选项</span></a></h3><div class="language-md" data-highlighter="shiki" data-ext="md" style="--shiki-light:#393a34;--shiki-dark:#dbd7caee;--shiki-light-bg:#ffffff;--shiki-dark-bg:#121212;"><pre class="shiki shiki-themes vitesse-light vitesse-dark vp-code"><code class="language-md"><span class="line"><span style="--shiki-light:#393A34;--shiki-dark:#DBD7CAEE;">@</span><span style="--shiki-light:#999999;--shiki-dark:#666666;">[</span><span style="--shiki-light:#B56959;--shiki-dark:#C98A7D;">jsfiddle theme="dark" tab="js,css,html,result" height="500px"</span><span style="--shiki-light:#999999;--shiki-dark:#666666;">](</span><span style="--shiki-light:#393A3490;--shiki-light-text-decoration:underline;--shiki-dark:#DEDCD590;--shiki-dark-text-decoration:underline;">user/id</span><span style="--shiki-light:#999999;--shiki-dark:#666666;">)</span></span></code></pre></div><ul><li><code>user</code>: 用户</li><li><code>id</code>: jsfiddle id</li><li><code>theme</code>: 主题模式， 可选值： <code>"light" | "dark"</code></li><li><code>tab</code>: 选项卡， 可选值：<code>"js" | "css" | "html" | "result"</code>, 多个用 <code>","</code> 分割， 顺序将决定选项卡的排序，默认为 <code>js,css,html,result</code></li><li><code>height</code>: 高度</li></ul><h2 id="示例" tabindex="-1"><a class="header-anchor" href="#示例"><span>示例</span></a></h2><p>输入：</p><div class="language-md" data-highlighter="shiki" data-ext="md" style="--shiki-light:#393a34;--shiki-dark:#dbd7caee;--shiki-light-bg:#ffffff;--shiki-dark-bg:#121212;"><pre class="shiki shiki-themes vitesse-light vitesse-dark vp-code"><code class="language-md"><span class="line"><span style="--shiki-light:#393A34;--shiki-dark:#DBD7CAEE;">@</span><span style="--shiki-light:#999999;--shiki-dark:#666666;">[</span><span style="--shiki-light:#B56959;--shiki-dark:#C98A7D;">jsfiddle</span><span style="--shiki-light:#999999;--shiki-dark:#666666;">](</span><span style="--shiki-light:#393A3490;--shiki-light-text-decoration:underline;--shiki-dark:#DEDCD590;--shiki-dark-text-decoration:underline;">pengzhanbo/1xbwz2p9</span><span style="--shiki-light:#999999;--shiki-dark:#666666;">)</span></span></code></pre></div><p>输出：</p>`,10),n(_,{width:`100%`,height:`400px`,source:`pengzhanbo/1xbwz2p9`,title:`JS Fiddle`,tab:`js,css,html,result`}),c[6]||=a(`<p>输入：</p><div class="language-md" data-highlighter="shiki" data-ext="md" style="--shiki-light:#393a34;--shiki-dark:#dbd7caee;--shiki-light-bg:#ffffff;--shiki-dark-bg:#121212;"><pre class="shiki shiki-themes vitesse-light vitesse-dark vp-code"><code class="language-md"><span class="line"><span style="--shiki-light:#393A34;--shiki-dark:#DBD7CAEE;">@</span><span style="--shiki-light:#999999;--shiki-dark:#666666;">[</span><span style="--shiki-light:#B56959;--shiki-dark:#C98A7D;">jsfiddle tab="result,js,css,html"</span><span style="--shiki-light:#999999;--shiki-dark:#666666;">](</span><span style="--shiki-light:#393A3490;--shiki-light-text-decoration:underline;--shiki-dark:#DEDCD590;--shiki-dark-text-decoration:underline;">pengzhanbo/1xbwz2p9</span><span style="--shiki-light:#999999;--shiki-dark:#666666;">)</span></span></code></pre></div><p>输出：</p>`,3),n(_,{width:`100%`,height:`400px`,source:`pengzhanbo/1xbwz2p9`,title:`JS Fiddle`,tab:`result,js,css,html`})])}var m=s(l,[[`render`,p]]);export{c as _pageData,m as default}; |