Coding

This plugin provides the following features to enhance coding:

• Code Tabs: Add tabs to your code block.
• Code Demo: Display and run code snippets in browser.
• Playground: Embed external playground site.
• Vue Playground: Reactive vue playground.

Demo

Code Tabs

pnpm

pnpm add -D vuepress-plugin-md-enhance

yarn

yarn add -D vuepress-plugin-md-enhance

npm

npm i -D vuepress-plugin-md-enhance

• View Detail

Code Demo

A normal demo

<h1>VuePress Theme Hope</h1>
<p>Is <span id="very">very</span> powerful!</p>

document.querySelector("#very").addEventListener("click", () => {
  alert("Very powerful!");
});

span {
  color: red;
}

• View Detail

Playground

TS demo

• View Detail

Vue Playground

Vue Playground

• View Detail