# @xiaopanda/vuepress-plugin-code-copy

> A vuepress plugin that copies code blocks with one click.

Latest version **1.0.3** (published 2020-09-21) · MIT license · 0 weekly downloads

## Install

```sh
npm install @xiaopanda/vuepress-plugin-code-copy
pnpm add @xiaopanda/vuepress-plugin-code-copy
yarn add @xiaopanda/vuepress-plugin-code-copy
bun add @xiaopanda/vuepress-plugin-code-copy
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.0.3 |
| Published | 2020-09-21 |
| First published | 2020-09-16 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 0 |
| Unpacked size | 9.4 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 4 |
| Author | Pan |
| Maintainers | panxingcheng |
| Keywords | vuepress, vuepress plugin, code copy, copy, clipboard |

## Links

- npm: https://www.npmjs.com/package/@xiaopanda/vuepress-plugin-code-copy
- Repository: https://github.com/panxingcheng/vuepress-plugin-code-copy
- Homepage: https://github.com/panxingcheng/vuepress-plugin-code-copy#readme
- Issues: https://github.com/panxingcheng/vuepress-plugin-code-copy/issues
- npm.io page: https://npm.io/package/@xiaopanda/vuepress-plugin-code-copy

## Recent versions

- 1.0.3 (latest) — 2020-09-21
- 1.0.2 — 2020-09-16

## README

# @xiaopanda/vuepress-plugin-code-copy

[![NPM version](https://badgen.net/npm/v/@xiaopanda/vuepress-plugin-code-copy)](https://npmjs.com/package/@xiaopanda/vuepress-plugin-code-copy) 
[![NPM downloads](https://badgen.net/npm/dm/@xiaopanda/vuepress-plugin-code-copy)](https://npmjs.com/package/@xiaopanda/vuepress-plugin-code-copy) 
[![NPM LICENSE](https://badgen.net/npm/license/@xiaopanda/vuepress-plugin-code-copy)](https://github.com/panxingcheng/vuepress-plugin-code-copy/blob/master/LICENSE)

[English](./README.md) | [中文](./README.zh-CN.md)

> A VuePress plugin that copies code blocks with one click.

## Install

```bash
yarn add -D @xiaopanda/vuepress-plugin-code-copy
# OR 
npm install -D @xiaopanda/vuepress-plugin-code-copy
```

## Usage
The plugin needs to be added to the `plugins` under `.vuepress/config.js` in the VuePress project:

```js
module.exports = {
  plugins: ['@xiaopanda/vuepress-plugin-code-copy'] 
}
```

## Options
This plugin takes a number of options, which can be configured in the `options` object under `plugin`:

```js
module.exports = {
  plugins: [
    ['@xiaopanda/vuepress-plugin-code-copy', {
        buttonStaticIcon: Boolean,
        buttonIconTitle: String,
        buttonAlign: String,
        buttonColor: String
       }
    ]
  ]
}
```

### buttonStaticIcon

* Type: `Boolean`
* Default: `false`

The copy button is only visible when hovers the mouse over the code block, or always visible.

### buttonIconTitle

* Type: `String`
* Default: `Copy`

The title content will appear when the mouse hovers over the copy button.

### buttonAlign

* Type: `String`
* Default: `top`
* Supported options: `top` or `bottom`

The copy button is aligned at the top-right or bottom-right corner of the code block.

### buttonColor

* Type: `String`
* Default: `#ffffff`

The color of the copy button, you can set any [Hex color codes](https://htmlcolorcodes.com/).

## LICENSE

[MIT](./LICENSE)

---
_Source: https://npm.io/package/@xiaopanda/vuepress-plugin-code-copy · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._