vite-plugin-url-copy

1.1.4 verified Mon Apr 27 auth: no javascript

Vite plugin (v1.1.4) that automatically copies the dev/preview server URL to clipboard and optionally generates a QR code for network access. Stable, actively maintained with monthly releases. Supports custom copy content, QR colors, and hot reload. Differentiator: combines URL copy and QR code generation in one plugin, with no extra dependencies. Requires Vite >=4.0.0.

Common errors

error ServerUrlCopy is not a function ↓

cause Using CommonJS require() with ESM-only import attempt or misconfigured module system.

fix

Ensure package.json has 'type': 'module' and use 'import ServerUrlCopy from 'vite-plugin-url-copy'.

error Cannot find module 'vite-plugin-url-copy' or its corresponding type declarations ↓

cause Forgetting to install the package or incorrect import path (e.g., missing default export).

fix

Run 'npm i -D vite-plugin-url-copy' and use 'import ServerUrlCopy from 'vite-plugin-url-copy'.

error TypeError: Cannot destructure property 'copy' of '...' as it is undefined ↓

cause Using old config format (<1.1.0) where options were flat. New version expects nested objects.

fix

Update config to: ServerUrlCopy({ copy: { mode: 'local' }, qrcode: { disabled: true } })

Warnings

breaking v1.1.0 introduced a new config API structure. Old config object will fail silently or produce unexpected behavior. ↓

fix Update config to match v1.1.0+ format: { copy: { ... }, qrcode: { ... }, disabled, debug }

deprecated CJS build of the plugin is deprecated and will be removed in v2. Use ESM. ↓

fix Set 'type': 'module' in package.json and use import syntax.

gotcha QR code is disabled by default. You must explicitly set qrcode.disabled = false to enable it. ↓

fix Add 'qrcode: { disabled: false }' to the plugin config.

gotcha To access the network URL, the Vite server must have host set to true (or --host flag). Otherwise only localhost is shown. ↓

fix Add 'server: { host: true }' and/or 'preview: { host: true }' in Vite config.

Install

npm install vite-plugin-url-copy

yarn add vite-plugin-url-copy

pnpm add vite-plugin-url-copy

Imports

ServerUrlCopy
wrong
```
const ServerUrlCopy = require('vite-plugin-url-copy')
```
correct
```
import ServerUrlCopy from 'vite-plugin-url-copy'
```
Default ESM export. CJS require works in v1 but is deprecated and will be removed in v2.
vite-plugin-url-copy
```
import ServerUrlCopy from 'vite-plugin-url-copy'
```
The package does not export named members. Always use default import.
type ServerUrlCopyOptions
```
import type { ServerUrlCopyOptions } from 'vite-plugin-url-copy'
```
Types are exported for configuration. Use import type for compile-time only.

Quickstart

Configure vite-plugin-url-copy in vite.config.ts with network URL copy and QR code enabled.

// vite.config.ts
import { defineConfig } from 'vite'
import ServerUrlCopy from 'vite-plugin-url-copy'

export default defineConfig({
  plugins: [
    ServerUrlCopy({
      copy: { mode: 'network' },
      qrcode: { disabled: false, color: 'blue' },
      debug: true,
    })
  ],
  server: { host: true },
})

// Then run: pnpm dev
// The terminal will show the local & network URLs, copy the network URL, and display a QR code.