unplugin-whistle-proxy

What's this?

A proxy plugin for build tools implemented by whistle.

Start a whistle proxy server when developing, and automatically select the rule.

Features

• 👌 Ready to use
• 🔥 Hot reload
• 📃 All rules in one file

Usage

1. Install

npm i unplugin-whistle-proxy --dev
pnpm add unplugin-whistle-proxy -D
yarn add unplugin-whistle-proxy -D

2. Write rules

Create a proxy-rule file in the root directory of your project.

// proxy-rule
helloworld.com localhost:5173

3. Add plugin to build tools

And then add the following code to enable the plugin.

Vite

// vite.config.ts
import whistle from 'unplugin-whistle-proxy/vite'

export default defineConfig({
  plugins: [
    whistle({ /* options */ }),
  ],
})

Example: playground/

Rollup

// rollup.config.js
import whistle from 'unplugin-whistle-proxy/rollup'

export default {
  plugins: [
    whistle({ /* options */ }),
  ],
}

Webpack

// webpack.config.js
module.exports = {
  /* ... */
  plugins: [
    require('unplugin-whistle-proxy/webpack')({ /* options */ })
  ]
}

Nuxt

// nuxt.config.js
export default defineNuxtConfig({
  modules: [
    ['unplugin-whistle-proxy/nuxt', { /* options */ }],
  ],
})

This module works for both Nuxt 2 and Nuxt Vite

Vue CLI

// vue.config.js
module.exports = {
  configureWebpack: {
    plugins: [
      require('unplugin-whistle-proxy/webpack')({ /* options */ }),
    ],
  },
}

esbuild

// esbuild.config.js
import { build } from 'esbuild'
import whistle from 'unplugin-whistle-proxy/esbuild'

build({
  plugins: [whistle()],
})

Options

interface Options extends WhistleOptions {
  /**
   * Rule file path
   * @default './proxy-rule'
   */
  rulePath?: string
}