Who it is forA Vue 3 developer whose bug depends on Pinia store values or a specific route, and who wants an agent to check both on the running app.
The problemReproducing a bug that depends on store contents or a deep route means navigating the app manually and reading state from browser tools.
The outcomeThe agent reads the Pinia store values, moves the app to the requested Vue Router route, and reports what it finds.
What you need first
- A web app built with Vue 3, React, Svelte 5, or Solid, run through Vite 8, Nuxt (with Nuxt DevTools 4), or Next.js (App Router)
- pnpm and Node.js available to install the package
- An MCP-capable coding agent to connect to devframe
- A browser tab open to the running app
Steps
- Install Medula and Vite DevTools with
pnpm add -D medula @vitejs/devtools. - In vite.config.ts, set
devtools: trueand addmedula()next tovue()in plugins. - Add the MCP server to your agent's configuration with command
npxand argsdevframe connect. - Start your dev server, open the app in your browser, and complete any DevTools connection code prompt.
- Ask the agent to read a Pinia store or open a named route, then compare the result with the page.
Prompt for your agent
Using the medula MCP tools from the medula repo, connect to the running Vue dev server for <app-port>, read the state of the Pinia store named <store-name>, then open the route <route-path>. Expected output: the store state and the route the page now shows. Verify that the page displays the same route the agent reports.
Caveat. Pinia and Vue Router support is listed only for Vue apps, so this use case does not apply to React, Svelte, or Solid projects.
Get 5 new use cases every morning. Free, one short email, unsubscribe anytime.
Get them freeShare: X LinkedIn Hacker News Email Copy link
Disclaimer
Deduped lists open-source repositories that belong to other people. We do not own, maintain, audit, or vouch for any of them, and a repo appearing here is not an endorsement or a safety check. The use cases, steps, and prompts are written by AI and may be incomplete, outdated, or just wrong. Where a use case is marked "Seen in the wild", we link to public posts where someone described something similar, but we have not verified those posts and the use case itself is still our AI's own write-up. Use all of this at your own risk. Only run code, commands, or agents on systems and accounts you are authorized to use, and read the code and every command before you run it, especially anything that touches credentials, files, or the network. Nothing here is professional, security, legal, or financial advice. All trademarks and project names belong to their respective owners, and their use here does not imply affiliation. Content is provided as is, without warranties of any kind. Found a mistake, a safety problem, or something you want removed? Email [email protected] and we will look at it promptly. Full disclaimer page