vite-tunnel

vite-tunnel is a skill for Claude Code from YuDefine/nuxt-supabase-starter. It costs 27 tokens per session (2,866 once invoked), scanned A, original, MIT.

A guide for exposing a local Vite development server through a Cloudflare Named Tunnel, giving it a stable public web address.

In plain words
What is it for?
It helps test real login callbacks, cookies, webhooks, and shared previews from devices outside the development machine.
Why use it?
It lets phones, other computers, OAuth services, and webhook providers reach a local server during development.

Skill for Claude Code

Written for Claude Code: disable-model-invocation in frontmatter.

Good fit It helps test real login callbacks, cookies, webhooks, and shared previews from devices outside the development machine.

Compare 6 skills from other repositories ↓
Install with agentmods
npx agentmods add skills/yudefine/nuxt-supabase-starter/vite-tunnel
Install

Getting it into your agent

One page per mod, every tool's command on it. A separate URL per tool would split the same page into five that compete with each other.

Any agent
npx skills add YuDefine/nuxt-supabase-starter --skill vite-tunnel
Clone the repo
git clone --depth 1 https://github.com/YuDefine/nuxt-supabase-starter

Made for: Claude Code.

Wrote this? Show the measurements

A badge with what this costs and how it scanned, read live from this page, so it follows the numbers instead of freezing them. Markdown for a README, HTML for a documentation site or a project page.

agentmods badge for vite-tunnel

README.md
[![agentmods](https://agentmods.dev/badge/skills/yudefine/nuxt-supabase-starter/vite-tunnel/github.svg)](https://agentmods.dev/skills/yudefine/nuxt-supabase-starter/vite-tunnel)
Your own site
<a href="https://agentmods.dev/skills/yudefine/nuxt-supabase-starter/vite-tunnel"><img src="https://agentmods.dev/badge/skills/yudefine/nuxt-supabase-starter/vite-tunnel/github.svg" alt="Measured on agentmods" height="20"></a>

Or the 80×15 button, for a site that already has a row of RSS and ATOM ones. Only the verdict fits; the numbers stay here.

agentmods 80×15 button for vite-tunnel

Your own site · 80×15
<a href="https://agentmods.dev/skills/yudefine/nuxt-supabase-starter/vite-tunnel"><img src="https://agentmods.dev/badge/skills/yudefine/nuxt-supabase-starter/vite-tunnel.svg" alt="Reviewed on agentmods" width="80" height="20"></a>
Per session 27 Skills are progressive disclosure: only the name and description are preloaded; the body loads when the skill is used.
When invoked 2,866 The whole file, excluding the scripts and references it only reads on demand.
Security scan A 1 finding. A grade says what 26 rules found in the file — not that it is safe. Third-party audits
  • NVIDIA SkillSpector pass 7 Sept 2026
How audits are shown
Origin original No closer match found in the catalogue.
Token cost

What it costs to keep this loaded

Counted locally with the o200k_base tokenizer, which is exact for GPT models; Claude uses its own tokenizer and its counts differ. Treat this as one consistent yardstick across the catalogue rather than a bill. Prices are per million input tokens.

ModelPer sessionOnce invoked
Fable 5.1 $0.00027 $0.02866
Opus 5 $0.00014 $0.01433
Sonnet 5 $0.00005 $0.00573
Haiku 4.5 $0.00003 $0.00287

Measured yesterday against content hash c5d896c9d789, method: parsed. Prices are Anthropic first-party input rates as of 2026-09-12, from the pricing page.

Security

Grade A, and why

vite-tunnel scanned grade A with 1 finding against 26 rules in 11 categories — prompt injection, anti-refusal, data exfiltration, privilege escalation, supply chain, agent snooping, system-prompt leakage, SSRF and excessive agency — measured yesterday.

A static scan of the body, not an audit. Every finding is printed with the line that produced it so you can judge whether it matters here. A mod is markdown that instructs an agent; that is exactly why what it instructs is worth reading.

Makes network callslowCapability

Not a fault in itself. Listed so you know the mod talks to something, and to what.

約定 tunnel-name = `<project>-dev`。Helper 需要 Python 3、curl 與 cloudflared;不自動登入。
template/.claude/skills/vite-tunnel/SKILL.md · 154 lines

How it starts

The opening of the file, as written. The whole thing — 154 lines — stays where its author put it; the contents beside it link to each section on GitHub.

本 skill 由使用者明確要求建立/設定 tunnel 時啟動,包含本機配置與外部 Cloudflare 資源修改;不屬唯讀稽核。原生叫用方式由各 target adapter 交付,取得 skill 不代表已授權 DNS、token、OAuth provider 或對外開放資源。依本次既有授權執行,缺的是資源決策或帳號授權時才詢問。

對應 cookbook:~/offline/clade/vendor/snippets/vite-tunnel/

何時用 vs 何時不用

用這個 skill

  • 真實 OAuth provider flow 必須跑(Apple Sign In、不能 mock、要驗 production-like cookie flow)
  • 手機 / 平板 / 另一台筆電要連 dev server 跑 OAuth callback / webhook
  • 對外人秀 dev preview,需要穩定 hostname

改走其他做法

  • 單機開發 + agent 並行驗證 → 用 vendor/snippets/dev-auth/ cookbook 繞 OAuth(更快、不依賴外部網路)
  • 不需固定 callback 的臨時 webhook 測試 → cloudflared tunnel --url http://localhost:<實際-port> 拿 quick tunnel;需要預先註冊固定 URL 時使用下方 named tunnel
  • 多 worktree 並行 dev server → dev-auth + cookie namespace 比 tunnel 簡單
  • 給產品加公開 hostname(例 <consumer-e>.<client-b>.tw)到 remotely-managed tunnel(cloudflared tunnel run --token)→ 不是本 skill。走 ~/offline/clade/vendor/snippets/cloudflare-tunnel-hostname/(API/CLI;dashboard 404 不是停工理由)

Step 1: 偵測專案部署 target

package.json / wrangler.toml / wrangler.jsonc

偵測信號 路線 後續
已安裝並在 Vite config 啟用支援 tunnel 的 @cloudflare/vite-plugin 官方 Vite 路線 設定 named tunnel,啟動後按 t + Enter
一般 Vite 專案且本次採用第三方整合 第三方路線 安裝並設定 vite-plugin-cloudflare-tunnel
Nuxt/Nitro 或其他已有 dev server、未使用上列整合 獨立 cloudflared 路線 依 cookbook 將 named tunnel ingress 指到實際 local dev URL,分別啟動 dev server 與 tunnel

wrangler.* 存在只表示有 Cloudflare 配置,不證明正在使用 Vite plugin。先查 lockfile 安裝版本、實際載入的 config 與該版本 API;Nuxt 專案的 Vite 配置由 Nuxt 承接,不假定根 vite.config.ts 會被讀取。官方選項依 Cloudflare local-dev tunnel 文件 核對。

Step 2: 前置檢查

先查專案文件、已授權帳號配置與當前工具能力:

  1. 取得 hostname、tunnel name 與實際 dev URL,確認目標 zone 與帳號識別。
  2. cloudflared 可執行性;缺少時依目前作業系統的官方安裝方式處理。
  3. 使用 locally-managed tunnel 的 setup 腳本需要有效 account certificate。檔案存在只證明有檔;核對選定 credential 的帳號與目標 zone。需要登入時依既有授權執行 cloudflared tunnel login,人類 OAuth 操作另列待辦。
  4. 多帳號時以實際 account/zone ID 與 credential binding 查證。Tunnel 名稱前綴不承載帳號身分。

Read the full file on GitHub · 154 lines

Changes

What this file has done since we first saw it

Hashed on every crawl. A supply-chain change to an agent config is a question of when, not whether, so the history is kept rather than the latest state alone.

  1. yesterday Changed · +1 lines c5d896c9d789
  2. 3d ago Changed · +1 lines 3bfe8a97293e
  3. 4d ago Changed · +5 lines 32d05a5dbbf6
  4. 8d ago First seen · 147 lines · 27 tokens per session scan A 5d490e02b084

Subscribe to this mod's changes

vite-tunnel is a skill published in the GitHub repository YuDefine/nuxt-supabase-starter (45 stars, last pushed today), licensed MIT. It adds 27 tokens to every session and 2,866 once invoked, about $0.0001 per session on Opus 5. A static security scan graded it A with 1 finding (makes network calls). No closer match exists in the catalogue, so it is treated as the original; first seen 2026-09-03.

Related

Other skills, from other repositories

web-design

A tool for designing and publishing single-page HTML websites, such as reports, landing pages, and data displays. It uses common web libraries for layouts, charts, icons, and responsive pages, then can deploy the result to Cloudflare Pages.

countbot-ai/CountBot · 81 tokens

nw-par-critique-dimensions

Platform design review critique dimensions and severity levels. Load when reviewing CI/CD pipelines, infrastructure, deployment strategies, observability, or security designs.

nWave-ai/nWave · 37 tokens

nw-deployment-strategies

Rollback procedures, risk assessment, pre/post-deployment validation, and contingency planning. Load when orchestrating deployment or preparing rollback plans. For deployment strategy details (canary, blue-green, rolling), see cicd-and-deployment skill.

nWave-ai/nWave · 57 tokens

nw-investigation-techniques

Evidence collection methods, problem categorization, analysis techniques, and solution design patterns.

nWave-ai/nWave · 21 tokens

prd-v07-implementation-loop

Execute implementation within EPICs following test-first development, continuous SoT updates, and code traceability during PRD v0.7 Build Execution. Triggers on requests to start building, implement an epic, begin coding, or when user asks "start building", "implement epic", "coding", "development", "build execution"…

mattgierhart/PRD-driven-context-engineering · 113 tokens

prd-v07-test-planning

Define test cases BEFORE implementation, ensuring every API, business rule, and user journey has verifiable acceptance criteria during PRD v0.7 Build Execution. Triggers on requests to define tests, plan test coverage, create test cases, or when user asks "define tests", "test planning", "what to test?", "test cases"…

mattgierhart/PRD-driven-context-engineering · 125 tokens