🔥Live code block for Docute

Please consider starring the project to show your ❤️ and support.

Only support Vue SFC string!
For others you might want to try docute-run-code

First load this plugin via <script> tag:

<!-- Load this plugin after docute.js --> <script src="https://cdn.jsdelivr.net/npm/docute-demo-code"></script>

This plugin exposed as window.docuteDemoCode

new Docute({ ... plugins: [ docuteDemoCode() ] })

Then, you can write a demo code block with live demo in .md file:
(Don't forget to specify the code language to html or vue)

# Introduction > Showcase for demo code :::demo ```html <template> <div>{{ msg }}</div> </template> <script> export default { data() { return { msg: 'Hi, 😋' } } } </script> ``` ::: 

Similar to vuepress custom container huh?

yarn add docute-demo-code --dev

In your entry file:

import Docute from 'docute' import docuteDemoCode from 'docute-demo-code' new Docute({ ... plugins: [ docuteDemoCode() ] })

docuteDemoCode(options: Options)

• Type: boolean
• Default: true

Use docute style to wrap living demo block

• docute-custom-container

1. Fork it!
2. Create your feature branch: git checkout -b my-new-feature
3. Commit your changes: git commit -am 'Add some feature'
4. Push to the branch: git push origin my-new-feature
5. Submit a pull request :D

docute-demo-code © evillt, Released under the MIT License.

Authored and maintained by EVILLT with help from contributors (list).

evila.me · GitHub @evillt · Twitter @evillt