@xysfe/vite-plugin-dev-proxy 1.0.0 → 1.0.2

package/README.md

@@ -1,4 +1,4 @@
-# vite-plugin-dev-proxy
+# @xysfe/vite-plugin-dev-proxy
 
 A Vite plugin for development environment proxy that automatically proxies remote server requests and handles HTML responses.
 
@@ -9,6 +9,8 @@ A Vite plugin for development environment proxy that automatically proxies remot
 - 🍪 Automatic cookie rewriting, removing Secure and Domain attributes
 - 🔀 Redirect handling with protocol mismatch fixes
 - ⚙️ Support for custom static resource prefixes
+- 🎯 Flexible script/link tag filtering with string, array, regex, or function
+- 🏷️ Custom placeholder replacement for development script injection
 - 🐛 Debug logging support
 - 🔗 Merge with other proxy configurations
 - 🔧 TypeScript support with full type definitions
@@ -16,15 +18,15 @@ A Vite plugin for development environment proxy that automatically proxies remot
 ## Installation
 
 ```bash
-npm install vite-plugin-dev-proxy --save-dev
+npm install @xysfe/vite-plugin-dev-proxy --save-dev
 ```
 
 ```bash
-yarn add vite-plugin-dev-proxy --dev
+yarn add @xysfe/vite-plugin-dev-proxy --dev
 ```
 
 ```bash
-pnpm add vite-plugin-dev-proxy --save-dev
+pnpm add @xysfe/vite-plugin-dev-proxy --save-dev
 ```
 
 ## Usage
@@ -34,7 +36,7 @@ pnpm add vite-plugin-dev-proxy --save-dev
 ```js
 // vite.config.js
 import { defineConfig } from "vite";
-import viteDevProxy from "vite-plugin-dev-proxy";
+import viteDevProxy from "@xysfe/vite-plugin-dev-proxy";
 
 export default defineConfig({
   plugins: [
@@ -50,7 +52,7 @@ export default defineConfig({
 ```js
 // vite.config.js
 import { defineConfig } from "vite";
-import viteDevProxy from "vite-plugin-dev-proxy";
+import viteDevProxy from "@xysfe/vite-plugin-dev-proxy";
 
 export default defineConfig({
   plugins: [
@@ -59,7 +61,9 @@ export default defineConfig({
       https: true,
       staticPrefix: "/dev/static",
       bypassPrefixes: ["/static"],
-      scriptCssPrefix: "/static/global",
+      clearScriptCssPrefixes: "/static/global",
+      developmentAgentOccupancy:
+        "<!-- Vite development mode proxy occupancy -->",
       entry: "/src/main.js",
       debug: true,
     }),
@@ -67,6 +71,32 @@ export default defineConfig({
 });
 ```
 
+### Advanced Usage: Custom Script/Link Filtering
+
+```js
+// vite.config.js
+import { RegeExp } from "vite";
+import viteDevProxy from "@xysfe/vite-plugin-dev-proxy";
+
+export default defineConfig({
+  plugins: [
+    viteDevProxy({
+      appHost: "example.com",
+      // Filter by string prefix
+      clearScriptCssPrefixes: "/static/global",
+      // Or filter by multiple prefixes
+      clearScriptCssPrefixes: ["/static/global", "/cdn/assets"],
+      // Or filter by regex
+      clearScriptCssPrefixes: /cdn\.example\.com/,
+      // Or filter by custom function
+      clearScriptCssPrefixes: (match) => {
+        return match.includes("remove-me");
+      },
+    }),
+  ],
+});
+```
+
 ### Coexisting with Other Proxy Configurations
 
 ```js
@@ -93,17 +123,18 @@ export default defineConfig({
 
 #### Options
 
-| Parameter         | Type       | Default          | Required | Description                                                                                     |
-| ----------------- | ---------- | ---------------- | -------- | ----------------------------------------------------------------------------------------------- |
-| `appHost`         | `string`   | -                | ✅       | Target server address                                                                           |
-| `https`           | `boolean`  | `true`           | -        | Whether to use HTTPS for the target server                                                      |
-| `staticPrefix`    | `string`   | `''`             | -        | Static resource prefix, used to build local entry path                                          |
-| `bypassPrefixes`  | `string[]` | `['/static']`    | -        | List of prefixes to bypass proxy, requests matching these prefixes will access remote resources |
-| `scriptCssPrefix` | `string`   | `''`             | -        | Script/CSS prefix, used to precisely match remote scripts and stylesheets to remove             |
-| `entry`           | `string`   | `'/src/main.js'` | -        | Local development entry file path                                                               |
-| `isLib`           | `boolean`  | `false`          | -        | Whether in component library mode, returns local HTML file when true                            |
-| `localIndexHtml`  | `string`   | `'index.html'`   | -        | Local HTML file path (only used when isLib=true)                                                |
-| `debug`           | `boolean`  | `false`          | -        | Whether to enable debug logging                                                                 |
+| Parameter                   | Type                                       | Default          | Required | Description                                                                                                                    |
+| --------------------------- | ------------------------------------------ | ---------------- | -------- | ------------------------------------------------------------------------------------------------------------------------------ |
+| `appHost`                   | `string`                                   | -                | ✅       | Target server address                                                                                                          |
+| `https`                     | `boolean`                                  | `true`           | -        | Whether to be HTTPS for the target server                                                                                      |
+| `staticPrefix`              | `string`                                   | `''`             | -        | Static resource prefix, used to build local entry path                                                                         |
+| `bypassPrefixes`            | `string[]`                                 | `['/static']`    | -        | List of prefixes to bypass proxy, requests matching these prefixes will access remote resources                                |
+| `clearScriptCssPrefixes`    | `string \| string[] \| RegExp \| Function` | `''`             | -        | Filter script/link tags to remove. Supports string prefix, array of prefixes, regex, or custom function                        |
+| `developmentAgentOccupancy` | `string`                                   | `''`             | -        | Custom placeholder string to replace with local development script. If not set, script will be injected into div with id="app" |
+| `entry`                     | `string`                                   | `'/src/main.js'` | -        | Local development entry file path                                                                                              |
+| `isLib`                     | `boolean`                                  | `false`          | -        | Whether in component library mode, returns local HTML file when true                                                           |
+| `localIndexHtml`            | `string`                                   | `'index.html'`   | -        | Local HTML file path (only used when isLib=true)                                                                               |
+| `debug`                     | `boolean`                                  | `false`          | -        | Whether to enable debug logging                                                                                                |
 
 ## How It Works
 
@@ -115,9 +146,15 @@ The plugin injects `server.proxy` configuration through Vite's `config` hook, pr
 
 When detecting a browser page navigation request and the response is HTML:
 
-- Removes remote `type="module" crossorigin` script tags
-- Removes remote `crossorigin` stylesheet link tags
-- Inserts local development script entry
+- Matches all `<script>` and `<link>` tags in the HTML
+- Removes tags based on `clearScriptCssPrefixes` configuration:
+  - If string: removes tags where src/href starts with the prefix
+  - If array: removes tags where src/href starts with any of the prefixes
+  - If RegExp: removes tags matching the regex pattern
+  - If Function: removes tags where the function returns true
+- Inserts local development script entry:
+  - If `developmentAgentOccupancy` is set, replaces that placeholder with the local script
+  - Otherwise, injects the local script into `<div id="app">` element
 
 ### 3. Cookie Rewriting
 
@@ -142,8 +179,7 @@ viteDevProxy({
 Log output example:
 
 ```
-vite-plugin-dev-proxy: staticPrefix /dev/static
-vite-plugin-dev-proxy: scriptCssPrefix /static/global
+@xysfe/vite-plugin-dev-proxy: staticPrefix /dev/static
 Proxy request: /admin/index (5ms)
 HTML processed: /admin/index (23ms)
 Bypass proxy: /static/js/app.js
@@ -155,7 +191,7 @@ Redirect handled: https://example.com/login -> http://localhost:3003/login (3ms)
 This plugin is written in TypeScript and provides full type definitions. You can import types for better development experience:
 
 ```typescript
-import viteDevProxy, { ProxyOptions } from "vite-plugin-dev-proxy";
+import viteDevProxy, { ProxyOptions } from "@xysfe/vite-plugin-dev-proxy";
 
 const config: ProxyOptions = {
   appHost: "example.com",
@@ -173,7 +209,8 @@ export default defineConfig({
 1. `appHost` is a required parameter, not providing it will throw an error
 2. The plugin will override `server.proxy` configuration in `vite.config.js`
 3. Ensure the local development server port matches the port in redirect handling
-4. Use `scriptCssPrefix` to precisely control which remote scripts and stylesheets to remove
+4. Use `clearScriptCssPrefixes` to flexibly control which remote scripts and stylesheets to remove
+5. Use `developmentAgentOccupancy` to specify a custom placeholder for script injection, or let the plugin automatically inject into `<div id="app">`
 
 ## Requirements
 
@@ -190,4 +227,4 @@ Contributions are welcome! Please feel free to submit a Pull Request.
 
 ## Issues
 
-If you encounter any issues, please report them on [GitHub Issues](https://github.com/CNLHB/vite-plugin-dev-proxy/issues).
+If you encounter any issues, please report them on [GitHub Issues](https://github.com/CNLHB/@xysfe/vite-plugin-dev-proxy/issues).

package/dist/index.cjs

@@ -218,6 +218,9 @@ function viteDevProxy(options = {}) {
   return {
     name: "vite-plugin-dev-proxy",
     config: (viteConfig) => {
+      if (process.env.NODE_ENV !== "development") {
+        return {};
+      }
       const pluginProxy = createProxyConfig(options);
       const existingProxy = viteConfig.server?.proxy || {};
       const mergedProxy = {

package/dist/index.mjs

@@ -211,6 +211,9 @@ function viteDevProxy(options = {}) {
   return {
     name: "vite-plugin-dev-proxy",
     config: (viteConfig) => {
+      if (process.env.NODE_ENV !== "development") {
+        return {};
+      }
       const pluginProxy = createProxyConfig(options);
       const existingProxy = viteConfig.server?.proxy || {};
       const mergedProxy = {

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@xysfe/vite-plugin-dev-proxy",
-	"version": "1.0.0",
+	"version": "1.0.2",
 	"description": "A Vite plugin for development environment proxy that automatically proxies remote server requests and handles HTML responses",
 	"files": [
 		"dist"