@oro.ad/nuxt-claude-devtools-bc 1.0.0

package/dist/module.d.mts

@@ -0,0 +1,77 @@
+import * as _nuxt_schema from '@nuxt/schema';
+
+interface TunnelConfig {
+    /**
+     * Tunnel host (without protocol)
+     * @default process.env.DEV_TUNNEL_HOST
+     */
+    host?: string;
+    /**
+     * Protocol for tunnel connection
+     * @default 'https'
+     */
+    protocol?: 'http' | 'https';
+    /**
+     * Port for HMR WebSocket
+     * @default 443 for https, 80 for http
+     */
+    port?: number;
+    /**
+     * Additional allowed hosts for Vite server
+     * @default []
+     */
+    additionalHosts?: string[];
+    /**
+     * Enable/disable tunnel configuration
+     * @default true (but only applies config if host is set)
+     */
+    enabled?: boolean;
+}
+interface ModuleOptions {
+    /**
+     * Tunnel configuration for dev server
+     */
+    tunnel?: TunnelConfig;
+    /**
+     * Enable Nuxt Devtools integration
+     * @default true
+     */
+    devtools?: boolean;
+    /**
+     * Disable Nuxt DevTools authorization when tunnel is active.
+     * Required for accessing DevTools through tunnel.
+     * @default true (auto-disables auth when tunnel is configured)
+     */
+    disableDevtoolsAuth?: boolean;
+}
+interface ResolvedTunnelConfig {
+    host: string;
+    protocol: 'http' | 'https';
+    port: number;
+    wsProtocol: 'ws' | 'wss';
+    origin: string;
+    allowedHosts: string[];
+}
+declare const _default: _nuxt_schema.NuxtModule<ModuleOptions, ModuleOptions, false>;
+
+declare module '@nuxt/schema' {
+    interface NuxtConfig {
+        claudeDevtoolsBc?: ModuleOptions;
+    }
+    interface NuxtOptions {
+        claudeDevtoolsBc?: ModuleOptions;
+    }
+    interface PublicRuntimeConfig {
+        claudeDevtoolsBc?: {
+            tunnel: {
+                host: string;
+                protocol: 'http' | 'https';
+                port: number;
+                origin: string;
+            } | null;
+        };
+    }
+}
+
+export { _default as default };
+export type { ModuleOptions, ResolvedTunnelConfig, TunnelConfig };

package/dist/module.json

@@ -0,0 +1,12 @@
+{
+  "name": "@oro.ad/nuxt-claude-devtools-bc",
+  "configKey": "claudeDevtoolsBc",
+  "compatibility": {
+    "nuxt": ">=3.0.0"
+  },
+  "version": "1.0.0",
+  "builder": {
+    "@nuxt/module-builder": "1.0.2",
+    "unbuild": "3.6.1"
+  }
+}

package/dist/module.mjs

@@ -0,0 +1,144 @@
+import { useLogger, defineNuxtModule, createResolver, addPlugin, addImports, addServerHandler } from '@nuxt/kit';
+import { defu } from 'defu';
+import { existsSync } from 'node:fs';
+
+const DEVTOOLS_UI_ROUTE = "/__claude-devtools-bc";
+const DEVTOOLS_UI_LOCAL_PORT = 3300;
+function setupDevToolsUI(nuxt, resolver, tunnelConfig) {
+  const clientPath = resolver.resolve("./client");
+  const isProductionBuild = existsSync(clientPath);
+  if (isProductionBuild) {
+    nuxt.hook("vite:serverCreated", async (server) => {
+      const sirv = await import('sirv').then((r) => r.default || r);
+      server.middlewares.use(
+        DEVTOOLS_UI_ROUTE,
+        sirv(clientPath, { dev: true, single: true })
+      );
+    });
+  } else {
+    nuxt.hook("vite:extendConfig", (config) => {
+      config.server = config.server || {};
+      config.server.proxy = config.server.proxy || {};
+      config.server.proxy[DEVTOOLS_UI_ROUTE] = {
+        target: `http://localhost:${DEVTOOLS_UI_LOCAL_PORT}${DEVTOOLS_UI_ROUTE}`,
+        changeOrigin: true,
+        followRedirects: true,
+        rewrite: (path) => path.replace(DEVTOOLS_UI_ROUTE, "")
+      };
+    });
+  }
+  const isTunnelActive = tunnelConfig !== null;
+  nuxt.hook("devtools:customTabs", (tabs) => {
+    tabs.push({
+      name: "claude-devtools-bc",
+      title: "Claude BC",
+      icon: isTunnelActive ? "carbon:connection-signal" : "carbon:connection-signal-off",
+      view: {
+        type: "iframe",
+        src: DEVTOOLS_UI_ROUTE
+      }
+    });
+  });
+}
+
+const logger = useLogger("@oro.ad/nuxt-claude-devtools-bc");
+function resolveTunnelConfig(options = {}) {
+  const host = options.host || process.env.DEV_TUNNEL_HOST;
+  if (!host) {
+    return null;
+  }
+  const protocol = options.protocol || process.env.DEV_TUNNEL_PROTOCOL || "https";
+  const port = options.port || Number(process.env.DEV_TUNNEL_PORT) || (protocol === "https" ? 443 : 80);
+  const wsProtocol = protocol === "https" ? "wss" : "ws";
+  const allowedHosts = [
+    host,
+    "localhost",
+    ...options.additionalHosts || []
+  ];
+  return {
+    host,
+    protocol,
+    port,
+    wsProtocol,
+    origin: `${protocol}://${host}`,
+    allowedHosts
+  };
+}
+const module$1 = defineNuxtModule({
+  meta: {
+    name: "@oro.ad/nuxt-claude-devtools-bc",
+    configKey: "claudeDevtoolsBc",
+    compatibility: {
+      nuxt: ">=3.0.0"
+    }
+  },
+  defaults: {
+    tunnel: {
+      enabled: true,
+      protocol: "https",
+      additionalHosts: []
+    },
+    devtools: true,
+    disableDevtoolsAuth: true
+  },
+  setup(options, nuxt) {
+    const resolver = createResolver(import.meta.url);
+    let resolvedTunnel = null;
+    if (nuxt.options.dev) {
+      if (options.tunnel?.enabled !== false) {
+        resolvedTunnel = resolveTunnelConfig(options.tunnel);
+        if (resolvedTunnel) {
+          logger.info(`Configuring for tunnel: ${resolvedTunnel.origin}`);
+          nuxt.options.vite = defu(nuxt.options.vite, {
+            server: {
+              allowedHosts: resolvedTunnel.allowedHosts,
+              origin: resolvedTunnel.origin,
+              hmr: {
+                protocol: resolvedTunnel.wsProtocol,
+                host: resolvedTunnel.host,
+                clientPort: resolvedTunnel.port
+              }
+            }
+          });
+          if (options.disableDevtoolsAuth !== false) {
+            nuxt.options.devtools = defu(nuxt.options.devtools, {
+              disableAuthorization: true
+            });
+            logger.info("DevTools authorization disabled for tunnel access");
+          }
+          logger.info("Vite server configured:");
+          logger.info(`  Origin: ${resolvedTunnel.origin}`);
+          logger.info(`  HMR: ${resolvedTunnel.wsProtocol}://${resolvedTunnel.host}:${resolvedTunnel.port}`);
+          logger.info(`  Allowed hosts: ${resolvedTunnel.allowedHosts.join(", ")}`);
+        } else {
+          logger.info("No tunnel host configured (set DEV_TUNNEL_HOST env or tunnel.host option)");
+        }
+      } else {
+        logger.info("Tunnel configuration disabled");
+      }
+    }
+    nuxt.options.runtimeConfig.public.claudeDevtoolsBc = {
+      tunnel: resolvedTunnel ? {
+        host: resolvedTunnel.host,
+        protocol: resolvedTunnel.protocol,
+        port: resolvedTunnel.port,
+        origin: resolvedTunnel.origin
+      } : null
+    };
+    addPlugin(resolver.resolve("./runtime/plugin"));
+    addImports({
+      name: "useTunnel",
+      as: "useTunnel",
+      from: resolver.resolve("./runtime/composables/useTunnel")
+    });
+    addServerHandler({
+      route: "/api/__claude-devtools-bc-config",
+      handler: resolver.resolve("./runtime/server/api/__claude-devtools-bc-config.get")
+    });
+    if (options.devtools && nuxt.options.dev) {
+      setupDevToolsUI(nuxt, resolver, resolvedTunnel);
+    }
+  }
+});
+
+export { module$1 as default };

package/dist/runtime/composables/useTunnel.d.ts

@@ -0,0 +1,12 @@
+export interface TunnelInfo {
+    host: string;
+    protocol: 'http' | 'https';
+    port: number;
+    origin: string;
+}
+export declare function useTunnel(): {
+    isActive: import("vue").ComputedRef<boolean>;
+    origin: import("vue").ComputedRef<string | null>;
+    host: import("vue").ComputedRef<string | null>;
+    config: TunnelInfo | null;
+};

package/dist/runtime/composables/useTunnel.js

@@ -0,0 +1,12 @@
+import { computed } from "vue";
+import { useRuntimeConfig } from "#app";
+export function useTunnel() {
+  const config = useRuntimeConfig();
+  const tunnelConfig = config.public?.claudeDevtoolsBc?.tunnel;
+  return {
+    isActive: computed(() => !!tunnelConfig),
+    origin: computed(() => tunnelConfig?.origin ?? null),
+    host: computed(() => tunnelConfig?.host ?? null),
+    config: tunnelConfig ?? null
+  };
+}

package/dist/runtime/plugin.d.ts

@@ -0,0 +1,12 @@
+declare const _default: import("#app").Plugin<{
+    claudeDevtoolsBc: {
+        tunnel: any;
+        isTunnelActive: boolean;
+    };
+}> & import("#app").ObjectPlugin<{
+    claudeDevtoolsBc: {
+        tunnel: any;
+        isTunnelActive: boolean;
+    };
+}>;
+export default _default;

package/dist/runtime/plugin.js

@@ -0,0 +1,20 @@
+import { defineNuxtPlugin, useRuntimeConfig } from "#app";
+export default defineNuxtPlugin(() => {
+  const config = useRuntimeConfig();
+  const tunnelConfig = config.public.claudeDevtoolsBc?.tunnel;
+  if (import.meta.dev && tunnelConfig) {
+    console.log(
+      `%c[Claude DevTools BC]%c Tunnel active: ${tunnelConfig.origin}`,
+      "background: #10b981; color: white; padding: 2px 6px; border-radius: 3px;",
+      "color: #10b981;"
+    );
+  }
+  return {
+    provide: {
+      claudeDevtoolsBc: {
+        tunnel: tunnelConfig,
+        isTunnelActive: tunnelConfig !== null
+      }
+    }
+  };
+});

package/dist/runtime/server/api/__claude-devtools-bc-config.get.d.ts

@@ -0,0 +1,2 @@
+declare const _default: any;
+export default _default;

package/dist/runtime/server/api/__claude-devtools-bc-config.get.js

@@ -0,0 +1,12 @@
+import { defineEventHandler, useRuntimeConfig } from "#imports";
+export default defineEventHandler(() => {
+  const config = useRuntimeConfig();
+  return {
+    tunnel: config.public.claudeDevtoolsBc?.tunnel ?? null,
+    env: {
+      DEV_TUNNEL_HOST: process.env.DEV_TUNNEL_HOST || null,
+      DEV_TUNNEL_PROTOCOL: process.env.DEV_TUNNEL_PROTOCOL || null,
+      DEV_TUNNEL_PORT: process.env.DEV_TUNNEL_PORT || null
+    }
+  };
+});

package/dist/types.d.mts

@@ -0,0 +1,3 @@
+export { default } from './module.mjs'
+
+export { type ModuleOptions, type ResolvedTunnelConfig, type TunnelConfig } from './module.mjs'

package/package.json

@@ -0,0 +1,74 @@
+{
+  "name": "@oro.ad/nuxt-claude-devtools-bc",
+  "version": "1.0.0",
+  "description": "Nuxt module for automatic Vite dev server configuration with tunnels (Cloudflare, ngrok, etc.) and DevTools integration",
+  "license": "GPL-3.0-only",
+  "type": "module",
+  "exports": {
+    ".": {
+      "types": "./dist/types.d.mts",
+      "import": "./dist/module.mjs"
+    }
+  },
+  "repository": {
+    "url": "https://github.com/oro-ad/nuxt-claude-devtools-bc"
+  },
+  "main": "./dist/module.mjs",
+  "author": "Simon Bystrov <jobsbystr@gmail.com> (https://sbystr.com/)",
+  "typesVersions": {
+    "*": {
+      ".": [
+        "./dist/types.d.mts"
+      ]
+    }
+  },
+  "files": [
+    "dist"
+  ],
+  "scripts": {
+    "prepack": "nuxt-module-build && npm run client:build",
+    "client:build": "nuxi generate client",
+    "client:dev": "nuxi dev client --port 3300",
+    "dev": "npm run play:dev",
+    "dev:prepare": "nuxt-module-build --stub && nuxi prepare client",
+    "prepare": "nuxi prepare client",
+    "play:dev": "nuxi dev playground",
+    "play:prod": "npm run prepack && nuxi dev playground",
+    "release": "npm run lint && npm run test && npm run prepack && changelogen --release && npm publish && git push --follow-tags",
+    "lint": "eslint ."
+  },
+  "dependencies": {
+    "@nuxt/devtools-kit": "^3.1.1",
+    "@nuxt/kit": "^4.2.2",
+    "defu": "^6.1.4",
+    "sirv": "^3.0.2"
+  },
+  "devDependencies": {
+    "@iconify-json/carbon": "^1.2.16",
+    "@nuxt/devtools": "^3.1.1",
+    "@nuxt/devtools-ui-kit": "^3.1.1",
+    "@nuxt/eslint-config": "^1.12.1",
+    "@nuxt/module-builder": "^1.0.2",
+    "@nuxt/schema": "^4.2.2",
+    "changelogen": "^0.6.2",
+    "eslint": "^9.39.2",
+    "nuxt": "^4.2.2",
+    "vitest": "^4.0.17"
+  },
+  "peerDependencies": {
+    "nuxt": "^3.0.0 || ^4.0.0"
+  },
+  "keywords": [
+    "nuxt",
+    "nuxt-module",
+    "nuxt-claude-business-console",
+    "vite",
+    "hmr",
+    "dev-server",
+    "devtools",
+    "business-console"
+  ],
+  "publishConfig": {
+    "access": "public"
+  }
+}