vite-plugin-online-debug 0.0.1

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2024
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,90 @@
+# Vite Plugin Template
+
+A template for creating Vite plugins with TypeScript, testing, and publishing setup.
+
+## Features
+
+- 📦 TypeScript support with type definitions
+- 🧪 Testing with Vitest
+- 📦 Dual CJS/ESM build with tsup
+- 🔍 ESLint configuration
+- 📚 Ready for npm publishing
+- 🎯 Example plugin implementation
+
+## Usage
+
+### Installation
+
+```bash
+npm install vite-plugin-template
+```
+
+### Basic Usage
+
+```typescript
+// vite.config.ts
+import { defineConfig } from 'vite'
+import templatePlugin from 'vite-plugin-template'
+
+export default defineConfig({
+  plugins: [
+    templatePlugin({
+      example: true
+    })
+  ]
+})
+```
+
+## Development
+
+### Setup
+
+```bash
+# Clone this template
+git clone https://github.com/yourusername/vite-plugin-template.git
+cd vite-plugin-template
+
+# Install dependencies
+npm install
+
+# Start development
+npm run dev
+```
+
+### Scripts
+
+- `npm run dev` - Build in watch mode
+- `npm run build` - Build the plugin
+- `npm run test` - Run tests
+- `npm run test:ui` - Run tests with UI
+- `npm run lint` - Run ESLint
+- `npm run lint:fix` - Fix ESLint issues
+- `npm run prepublishOnly` - Build and test before publishing
+
+### Publishing to npm
+
+1. Update `package.json` with your plugin details
+2. Update the repository URL in `package.json`
+3. Run `npm run build && npm test`
+4. Publish with `npm publish`
+
+## Plugin Development
+
+Your plugin's main logic goes in `src/index.ts`. The template includes:
+
+- Plugin options interface
+- Basic plugin structure with common hooks
+- Example transformation logic
+- Type safety with TypeScript
+
+### Testing
+
+Write your tests in the `tests/` directory. The template includes example tests that demonstrate:
+
+- Plugin creation
+- Option handling
+- Transformation logic
+
+## License
+
+MIT

package/dist/index.d.mts

@@ -0,0 +1,13 @@
+import { Plugin } from 'vite';
+
+interface PluginOptions {
+    /**
+     * @host 本地服务host，默认 127.0.0.1
+     * @entry 应用入口文件，默认 /src/main.js
+     */
+    host?: boolean;
+    entry?: string;
+}
+declare function createPlugin(options?: PluginOptions): Plugin;
+
+export { PluginOptions, createPlugin as default };

package/dist/index.d.ts

@@ -0,0 +1,13 @@
+import { Plugin } from 'vite';
+
+interface PluginOptions {
+    /**
+     * @host 本地服务host，默认 127.0.0.1
+     * @entry 应用入口文件，默认 /src/main.js
+     */
+    host?: boolean;
+    entry?: string;
+}
+declare function createPlugin(options?: PluginOptions): Plugin;
+
+export { PluginOptions, createPlugin as default };

package/dist/index.js

@@ -0,0 +1,102 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/index.ts
+var src_exports = {};
+__export(src_exports, {
+  default: () => createPlugin
+});
+module.exports = __toCommonJS(src_exports);
+function createPlugin(options = {}) {
+  const {
+    host = "127.0.0.1",
+    entry = "/src/main.js"
+  } = options;
+  return {
+    name: "vite-plugin-online-debug",
+    apply: "build",
+    transform(code, id) {
+      if (id.includes("/src/main.js")) {
+        const environmentCheckCode = `
+            ${code}
+            function loadScript(src, options = {}) {
+              return new Promise((resolve, reject) => {
+                // \u9A8C\u8BC1\u8F93\u5165\u53C2\u6570
+                if (!src) {
+                    reject(new Error('\u811A\u672CURL\u4E0D\u80FD\u4E3A\u7A7A'));
+                    return;
+                }
+        
+                // \u8BBE\u7F6E\u9ED8\u8BA4\u9009\u9879
+                const defaultOptions = {
+                    async: true,
+                    defer: false,
+                    type: 'text/javascript',
+                    charset: 'utf-8'
+                };
+        
+                // \u5408\u5E76\u9009\u9879
+                const config = Object.assign(defaultOptions, options);
+                console.log("\u{1F680} ~ loadScript ~ config:", config)
+        
+                // \u521B\u5EFAscript\u6807\u7B7E
+                const script = document.createElement('script');
+                script.src = src;
+                script.async = config.async;
+                script.defer = config.defer;
+                script.type = config.type;
+                script.charset = config.charset;
+        
+                // \u76D1\u542C\u52A0\u8F7D\u6210\u529F\u4E8B\u4EF6
+                script.onload = function() {
+                    resolve(script);
+                };
+        
+                // \u76D1\u542C\u52A0\u8F7D\u5931\u8D25\u4E8B\u4EF6
+                script.onerror = function() {
+                    reject(new Error('\u811A\u672C\u52A0\u8F7D\u5931\u8D25:' + src));
+                };
+        
+                // \u6DFB\u52A0\u5230\u9875\u9762\u4E2D
+                document.head.appendChild(script);
+              });
+            }
+            // \u73AF\u5883\u68C0\u6D4B\u903B\u8F91
+            if (import.meta.env.PROD && window.location.search?.indexOf('_debug_') > -1) {
+                // \u751F\u4EA7\u73AF\u5883\u903B\u8F91
+                const params = new URLSearchParams(window.location?.search || '');
+                const port = params.get('_debug_') || '8080';
+                const res = document.querySelector('#app');
+                res.__vue_app__?.unmount()
+                loadScript('http://${host}' + ':' + port + '${entry}', { type: 'module' })
+            }
+        `;
+        return environmentCheckCode;
+      }
+      return code;
+    },
+    buildStart() {
+      console.log("online-debug build started");
+    },
+    generateBundle() {
+      console.log("online-debug generating bundle");
+    }
+  };
+}
+//# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/index.ts"],"sourcesContent":["import type { Plugin } from 'vite'\n\nexport interface PluginOptions {\n  /**\n   * @host 本地服务host，默认 127.0.0.1\n   * @entry 应用入口文件，默认 /src/main.js\n   */\n  host?: boolean,\n  entry?: string,\n}\n\nexport default function createPlugin(options: PluginOptions = {}): Plugin {\n  const {\n    host = '127.0.0.1',\n    entry = '/src/main.js'\n  } = options;\n  return {\n    name: 'vite-plugin-online-debug',\n    apply: 'build',\n    \n    transform(code: string, id: string) {\n      if (id.includes('/src/main.js')) {\n          \n        const environmentCheckCode = `\n            ${code}\n            function loadScript(src, options = {}) {\n              return new Promise((resolve, reject) => {\n                // 验证输入参数\n                if (!src) {\n                    reject(new Error('脚本URL不能为空'));\n                    return;\n                }\n        \n                // 设置默认选项\n                const defaultOptions = {\n                    async: true,\n                    defer: false,\n                    type: 'text/javascript',\n                    charset: 'utf-8'\n                };\n        \n                // 合并选项\n                const config = Object.assign(defaultOptions, options);\n                console.log(\"🚀 ~ loadScript ~ config:\", config)\n        \n                // 创建script标签\n                const script = document.createElement('script');\n                script.src = src;\n                script.async = config.async;\n                script.defer = config.defer;\n                script.type = config.type;\n                script.charset = config.charset;\n        \n                // 监听加载成功事件\n                script.onload = function() {\n                    resolve(script);\n                };\n        \n                // 监听加载失败事件\n                script.onerror = function() {\n                    reject(new Error('脚本加载失败:' + src));\n                };\n        \n                // 添加到页面中\n                document.head.appendChild(script);\n              });\n            }\n            // 环境检测逻辑\n            if (import.meta.env.PROD && window.location.search?.indexOf('_debug_') > -1) {\n                // 生产环境逻辑\n                const params = new URLSearchParams(window.location?.search || '');\n                const port = params.get('_debug_') || '8080';\n                const res = document.querySelector('#app');\n                res.__vue_app__?.unmount()\n                loadScript('http://${host}' + ':' + port + '${entry}', { type: 'module' })\n            }\n        `;\n            return environmentCheckCode;\n        }\n        return code;\n    },\n\n    buildStart() {\n      console.log('online-debug build started')\n    },\n\n    generateBundle() {\n      console.log('online-debug generating bundle')\n    }\n  }\n}"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAWe,SAAR,aAA8B,UAAyB,CAAC,GAAW;AACxE,QAAM;AAAA,IACJ,OAAO;AAAA,IACP,QAAQ;AAAA,EACV,IAAI;AACJ,SAAO;AAAA,IACL,MAAM;AAAA,IACN,OAAO;AAAA,IAEP,UAAU,MAAc,IAAY;AAClC,UAAI,GAAG,SAAS,cAAc,GAAG;AAE/B,cAAM,uBAAuB;AAAA,cACvB,IAAI;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,qCAkDmB,IAAI,qBAAqB,KAAK;AAAA;AAAA;AAGvD,eAAO;AAAA,MACX;AACA,aAAO;AAAA,IACX;AAAA,IAEA,aAAa;AACX,cAAQ,IAAI,4BAA4B;AAAA,IAC1C;AAAA,IAEA,iBAAiB;AACf,cAAQ,IAAI,gCAAgC;AAAA,IAC9C;AAAA,EACF;AACF;","names":[]}

package/dist/index.mjs

@@ -0,0 +1,81 @@
+// src/index.ts
+function createPlugin(options = {}) {
+  const {
+    host = "127.0.0.1",
+    entry = "/src/main.js"
+  } = options;
+  return {
+    name: "vite-plugin-online-debug",
+    apply: "build",
+    transform(code, id) {
+      if (id.includes("/src/main.js")) {
+        const environmentCheckCode = `
+            ${code}
+            function loadScript(src, options = {}) {
+              return new Promise((resolve, reject) => {
+                // \u9A8C\u8BC1\u8F93\u5165\u53C2\u6570
+                if (!src) {
+                    reject(new Error('\u811A\u672CURL\u4E0D\u80FD\u4E3A\u7A7A'));
+                    return;
+                }
+        
+                // \u8BBE\u7F6E\u9ED8\u8BA4\u9009\u9879
+                const defaultOptions = {
+                    async: true,
+                    defer: false,
+                    type: 'text/javascript',
+                    charset: 'utf-8'
+                };
+        
+                // \u5408\u5E76\u9009\u9879
+                const config = Object.assign(defaultOptions, options);
+                console.log("\u{1F680} ~ loadScript ~ config:", config)
+        
+                // \u521B\u5EFAscript\u6807\u7B7E
+                const script = document.createElement('script');
+                script.src = src;
+                script.async = config.async;
+                script.defer = config.defer;
+                script.type = config.type;
+                script.charset = config.charset;
+        
+                // \u76D1\u542C\u52A0\u8F7D\u6210\u529F\u4E8B\u4EF6
+                script.onload = function() {
+                    resolve(script);
+                };
+        
+                // \u76D1\u542C\u52A0\u8F7D\u5931\u8D25\u4E8B\u4EF6
+                script.onerror = function() {
+                    reject(new Error('\u811A\u672C\u52A0\u8F7D\u5931\u8D25:' + src));
+                };
+        
+                // \u6DFB\u52A0\u5230\u9875\u9762\u4E2D
+                document.head.appendChild(script);
+              });
+            }
+            // \u73AF\u5883\u68C0\u6D4B\u903B\u8F91
+            if (import.meta.env.PROD && window.location.search?.indexOf('_debug_') > -1) {
+                // \u751F\u4EA7\u73AF\u5883\u903B\u8F91
+                const params = new URLSearchParams(window.location?.search || '');
+                const port = params.get('_debug_') || '8080';
+                const res = document.querySelector('#app');
+                res.__vue_app__?.unmount()
+                loadScript('http://${host}' + ':' + port + '${entry}', { type: 'module' })
+            }
+        `;
+        return environmentCheckCode;
+      }
+      return code;
+    },
+    buildStart() {
+      console.log("online-debug build started");
+    },
+    generateBundle() {
+      console.log("online-debug generating bundle");
+    }
+  };
+}
+export {
+  createPlugin as default
+};
+//# sourceMappingURL=index.mjs.map

package/dist/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/index.ts"],"sourcesContent":["import type { Plugin } from 'vite'\n\nexport interface PluginOptions {\n  /**\n   * @host 本地服务host，默认 127.0.0.1\n   * @entry 应用入口文件，默认 /src/main.js\n   */\n  host?: boolean,\n  entry?: string,\n}\n\nexport default function createPlugin(options: PluginOptions = {}): Plugin {\n  const {\n    host = '127.0.0.1',\n    entry = '/src/main.js'\n  } = options;\n  return {\n    name: 'vite-plugin-online-debug',\n    apply: 'build',\n    \n    transform(code: string, id: string) {\n      if (id.includes('/src/main.js')) {\n          \n        const environmentCheckCode = `\n            ${code}\n            function loadScript(src, options = {}) {\n              return new Promise((resolve, reject) => {\n                // 验证输入参数\n                if (!src) {\n                    reject(new Error('脚本URL不能为空'));\n                    return;\n                }\n        \n                // 设置默认选项\n                const defaultOptions = {\n                    async: true,\n                    defer: false,\n                    type: 'text/javascript',\n                    charset: 'utf-8'\n                };\n        \n                // 合并选项\n                const config = Object.assign(defaultOptions, options);\n                console.log(\"🚀 ~ loadScript ~ config:\", config)\n        \n                // 创建script标签\n                const script = document.createElement('script');\n                script.src = src;\n                script.async = config.async;\n                script.defer = config.defer;\n                script.type = config.type;\n                script.charset = config.charset;\n        \n                // 监听加载成功事件\n                script.onload = function() {\n                    resolve(script);\n                };\n        \n                // 监听加载失败事件\n                script.onerror = function() {\n                    reject(new Error('脚本加载失败:' + src));\n                };\n        \n                // 添加到页面中\n                document.head.appendChild(script);\n              });\n            }\n            // 环境检测逻辑\n            if (import.meta.env.PROD && window.location.search?.indexOf('_debug_') > -1) {\n                // 生产环境逻辑\n                const params = new URLSearchParams(window.location?.search || '');\n                const port = params.get('_debug_') || '8080';\n                const res = document.querySelector('#app');\n                res.__vue_app__?.unmount()\n                loadScript('http://${host}' + ':' + port + '${entry}', { type: 'module' })\n            }\n        `;\n            return environmentCheckCode;\n        }\n        return code;\n    },\n\n    buildStart() {\n      console.log('online-debug build started')\n    },\n\n    generateBundle() {\n      console.log('online-debug generating bundle')\n    }\n  }\n}"],"mappings":";AAWe,SAAR,aAA8B,UAAyB,CAAC,GAAW;AACxE,QAAM;AAAA,IACJ,OAAO;AAAA,IACP,QAAQ;AAAA,EACV,IAAI;AACJ,SAAO;AAAA,IACL,MAAM;AAAA,IACN,OAAO;AAAA,IAEP,UAAU,MAAc,IAAY;AAClC,UAAI,GAAG,SAAS,cAAc,GAAG;AAE/B,cAAM,uBAAuB;AAAA,cACvB,IAAI;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,qCAkDmB,IAAI,qBAAqB,KAAK;AAAA;AAAA;AAGvD,eAAO;AAAA,MACX;AACA,aAAO;AAAA,IACX;AAAA,IAEA,aAAa;AACX,cAAQ,IAAI,4BAA4B;AAAA,IAC1C;AAAA,IAEA,iBAAiB;AACf,cAAQ,IAAI,gCAAgC;AAAA,IAC9C;AAAA,EACF;AACF;","names":[]}

package/package.json

@@ -0,0 +1,52 @@
+{
+  "name": "vite-plugin-online-debug",
+  "version": "0.0.1",
+  "description": "debug with online environment",
+  "main": "dist/index.js",
+  "module": "dist/index.esm.js",
+  "types": "dist/index.d.ts",
+  "exports": {
+    ".": {
+      "import": "./dist/index.esm.js",
+      "require": "./dist/index.js",
+      "types": "./dist/index.d.ts"
+    }
+  },
+  "files": [
+    "dist"
+  ],
+  "scripts": {
+    "dev": "npm run build -- --watch",
+    "build": "tsup src/index.ts --format cjs,esm --dts",
+    "test": "vitest",
+    "test:ui": "vitest --ui",
+    "lint": "eslint src --ext .ts",
+    "lint:fix": "eslint src --ext .ts --fix",
+    "prepublishOnly": "npm run build"
+  },
+  "keywords": [
+    "vite",
+    "plugin",
+    "vite-plugin",
+    "debug"
+  ],
+  "author": "estrayn5",
+  "license": "MIT",
+  "repository": {
+    "type": "git",
+    "url": ""
+  },
+  "devDependencies": {
+    "@types/node": "^20.0.0",
+    "@typescript-eslint/eslint-plugin": "^6.0.0",
+    "@typescript-eslint/parser": "^6.0.0",
+    "eslint": "^8.0.0",
+    "tsup": "^7.0.0",
+    "typescript": "^5.0.0",
+    "vite": "^5.0.0",
+    "vitest": "^1.0.0"
+  },
+  "peerDependencies": {
+    "vite": "^3.0.0 || ^4.0.0 || ^5.0.0"
+  }
+}