vue-clipboard2

vue-clipboard2 is a small Vue plugin that wraps clipboard.js to make copy-to-clipboard functionality declarative in Vue 2 and Vue 3 applications. Register it with Vue.use() and you get v-clipboard directives to bind copy actions to elements, plus a programmatic this.$copyText() method for copying without a dedicated button.

The plugin handles success and error callbacks so you can show feedback after a copy, and it works both with a bundler and as a standalone script tag. Note that the project is deprecated by its author, who recommends the native Clipboard API for new projects.

What You Get

• A Vue plugin registered via Vue.use() for Vue 2 and Vue 3
• v-clipboard directives to bind copy targets and success/error handlers to elements
• A programmatic this.$copyText() method for copying without a button
• Success and error callbacks for showing copy feedback
• Bundler and standalone script-tag usage with a prebuilt dist file

Common Use Cases

• Adding a copy button for share links or code snippets in a Vue app
• Copying text programmatically after a user action without a visible button
• Showing a confirmation toast when a copy succeeds or fails
• Wiring copy-to-clipboard into legacy Vue 2 projects

Under The Hood

Architecture — The whole plugin is a single vue-clipboard.js file that exports an object with an install(Vue) method following Vue’s plugin convention. On install it registers a global v-clipboard directive whose bind/update/unbind hooks instantiate and tear down clipboard.js objects per element, wires success/error listeners to element-bound callbacks, and attaches a $copyText method to Vue’s prototype that resolves via a temporary clipboard.js instance.

Tech Stack — Vanilla JavaScript with a single runtime dependency on clipboard.js (^2.0.0). It is bundled with Browserify and minified with UglifyJS, and ships a prebuilt UMD dist file plus an index.d.ts for TypeScript consumers. It targets both Vue 2 and Vue 3.

Code Quality — The codebase is tiny and linted with ESLint (standard config), but there is no automated test suite; verification is done through the sample HTML files under samples/. Given the small surface area the risk is low, though the project is explicitly deprecated and no longer maintained.

API Design — The API is minimal and idiomatic to Vue: install the plugin, then either use v-clipboard directives declaratively or call this.$copyText() imperatively. Both paths surface success and error callbacks. The README covers the handful of usage patterns clearly, making adoption trivial for anyone familiar with Vue plugins.