vitepress-copy-helper

This plugin lets you add a copy button to your single-backtick-code-blocks and general purpose copy buttons.

Installation

npm install --save-dev vitepress-copy-helper

Usage

In .vitepress/theme/index.js:

import CopyButton from 'vitepress-copy-helper';
import 'vitepress-copy-helper/style.css'

then, in the enhanceApp function, add:

app.component('C', CopyButton),

C is the name of the component you will use in your markdown files, you can change it to whatever you want.

Default Settings

To override the default settings, change the import to:

import {default as CopyButton, defaultSettings} from 'vitepress-copy-helper'
import 'vitepress-copy-helper/style.css'

Just change the properties of defaultSettings to your liking:

| Property | Type | Default | Description | | --- | --- | --- | --- | | position | string | 'auto' | The position of the button, relative to the target code-element. auto, start, end | | message | string | 'copied' | The message that will be displayed when the button is clicked | | label | string | null | The label of the button, if null, no label is rendered | | classes | string | 'copy-btn' | The classes that will be added to the button | | target | string | 'auto' | Controls which code-element the button attaches to when wedged between code-elements | | preferSibling | string | 'previous' | Controls which code-element is picked when button is wedged and target is auto. previous, next |

Examples

Look here for usage examples