# Trace a runtime bug from a stack trace in Nuxt with Atlas in 2026

> Nuxt developers can use Atlas to quickly trace production runtime bugs from a stack trace, identifying the exact line and applying a fix with `vitest`.

Atlas helps Nuxt developers in 2026 trace runtime bugs from production stack traces to the responsible line and a fix, without a debugger attached, by reading each frame, grepping for error messages, and using LSP to find callers. This process integrates directly with your Nuxt project's `pages/` routes, `composables/` auto-imports, and `server/api/` Nitro handlers, culminating in a fix and a regression test using `vitest (@nuxt/test-utils)`.

## Key takeaways

- Atlas directly consumes Nuxt stack traces, validating file offsets for accuracy.
- `grep` and `lsp` tools pinpoint error origins and callers in Nuxt projects.
- Atlas's `edit` tool fixes Nuxt code with explicit diff approval for safety.
- Regression tests are added using `vitest (@nuxt/test-utils)` for Nuxt bugs.
- Atlas ensures Nuxt code quality with `prettier` and robust git integration.

## How Atlas reads Nuxt stack traces to pinpoint errors

Atlas consumes a production Nuxt stack trace, reading each `file:line` pair to identify the exact code location. This process ensures that even in 2026, a trace from an older build will fail loudly if offsets are out of range, preventing misdiagnosis of a bug.

Atlas begins the bug tracing process by using its `read` tool to consume each `file:line` pair from your production Nuxt stack trace. This is crucial for Nuxt projects, where file paths like `pages/index.vue` or `composables/useMyData.ts` are common. Atlas reads the content of each specified file at the reported offset, providing immediate context for the error. A key safety feature is Atlas's offset validation: if a trace originates from an older build of your Nuxt application, Atlas will report that the `Offset <n> is out of range for this file`, preventing you from investigating incorrect code. This ensures that the line numbers you are examining are always relevant to your current Nuxt codebase. Atlas's understanding of Nuxt's file-based routing and auto-imports means it can accurately navigate your project structure, whether the error is in a client-side component, a server-side Nitro handler, or a shared composable.

## How to grep for Nuxt error messages and find callers with Atlas

After reading the initial stack frames, Atlas leverages its `grep` tool to search for the specific error message string within your Nuxt project. This often reveals the error's construction point, which is typically more informative than the top stack frame, especially in complex Nuxt applications with 10s of components and modules.

Once Atlas has processed the initial stack frames, it proceeds to use its `grep` tool to locate the exact error message string within your Nuxt codebase. This step is vital because the point where an error message is constructed often provides deeper insight into the root cause than just the top-most frame of the stack trace. For instance, an error originating from a `server/api/` Nitro handler might be constructed in a utility file, and `grep` helps pinpoint that. Following this, Atlas employs its `lsp` tool with the `findReferences` operation. This allows Atlas to identify all callers of the failing function, providing a comprehensive view of which parts of your Nuxt application can reach the problematic code with bad input. This is particularly useful in Nuxt's reactive environment, where a `useAsyncData` call in a component might trigger an issue in a backend API route, and `findReferences` helps trace that dependency.

## Fixing Nuxt bugs and adding regression tests with Atlas

Once the root cause of a Nuxt bug is identified, Atlas facilitates the fix using its `edit` tool, allowing you to modify files like `pages/index.vue` or `server/api/data.ts`. To prevent recurrence, Atlas then helps add a regression test, typically using `vitest (@nuxt/test-utils)`, ensuring the bug cannot silently reappear across 100s of future commits.

After Atlas has helped pinpoint the exact location and cause of a Nuxt runtime bug, the next step is to implement a fix. Atlas uses its `edit` tool to modify the relevant files, whether it is a `.vue` component in `pages/`, a TypeScript file in `composables/`, or a Nitro handler in `server/api/`. Atlas computes a unified diff for every proposed file edit and surfaces it for your approval before writing any changes, ensuring you maintain full control. Crucially, to prevent the bug from recurring silently, Atlas then assists in adding a regression test. For Nuxt projects, this means leveraging `vitest` through `@nuxt/test-utils`. Atlas can draft a new test file or modify an existing one, covering the specific scenario that led to the bug. After the fix and test are in place, Atlas can run `prettier` over the touched `.vue` and `.ts` files, ensuring your Nuxt codebase remains consistently formatted according to your project's standards.

## Atlas safety and review for Nuxt code changes

Atlas prioritizes safety and developer control throughout the bug tracing and fixing process in Nuxt projects. Every Atlas tool call is permission-gated against allow, ask, and deny rules, ensuring you approve actions before they run. This includes critical steps like modifying `nuxt.config.ts` or adding new `server/api/` routes, with 3 distinct permission levels.

Atlas is designed with multiple layers of safety and review for Nuxt developers. Before any action is taken, Atlas drafts a plan in a read-only plan agent and asks for your approval before switching to a build agent that can execute changes. Every Atlas tool call, including `read`, `grep`, `lsp`, and `edit`, is permission-gated against allow, ask, and deny rules, giving you granular control over what Atlas can do in your Nuxt project. When Atlas proposes an `edit`, it computes a unified diff for every file change and surfaces it for your explicit approval before writing. This applies to any file, from a `pages/` component to your `nuxt.config.ts`. Furthermore, Atlas reads git branches, status, and diffs, and can stage and create commits on your behalf, ensuring that all changes are tracked and reversible. Atlas also snapshots file changes as git patches, so edits can be easily diffed and rolled back if needed, providing robust safety for your Nuxt application development.

## Steps

1. Paste your production Nuxt stack trace into Atlas and let Atlas `read` each `file:line` frame, such as `pages/index.vue:25` or `server/api/data.ts:10`.
2. If Atlas reports `Offset <n> is out of range for this file` for a Nuxt file, re-read the file from the top before trusting any line number, as the trace likely came from an older build.
3. Instruct Atlas to `grep` for the specific error message string found in the Nuxt stack trace to locate where the error is constructed, often more informative than the top frame.
4. Use Atlas's `lsp` tool with the `findReferences` operation on the identified failing function within your Nuxt codebase to see all callers that can reach it with the problematic input.
5. Approve Atlas's plan to `edit` the responsible Nuxt file, such as a `composables/useMyFeature.ts` or a `pages/products/[id].vue` component, to implement the necessary fix.
6. Ask Atlas to add a regression test using `vitest` through `@nuxt/test-utils`, ensuring the specific Nuxt bug scenario is covered and cannot recur silently.
7. Review the unified diff provided by Atlas for the proposed changes, then let Atlas run `prettier` over the touched `.vue` and `.ts` files to maintain Nuxt project formatting.
8. Approve Atlas to stage and create a git commit for the fix and the new `vitest` regression test.

## FAQ

### How does Atlas handle Nuxt's auto-imports when tracing bugs?

Atlas indexes code by AST declarations using tree-sitter, allowing it to understand Nuxt's `composables/` auto-imports and other module resolutions, accurately tracing calls even without explicit imports.

### Can Atlas differentiate between server-side and client-side Nuxt errors?

Yes, Atlas is paired with Nuxt to respect the server/client split of Nitro. It can identify if an error originates from a `server/api/` handler or a client-side `pages/` component.

### What if my Nuxt stack trace is from an older build?

Atlas validates offsets against the current file. If an `Offset <n> is out of range`, Atlas will loudly report this, preventing you from debugging outdated code in your Nuxt project.

### How does Atlas ensure code quality after a Nuxt bug fix?

After applying a fix, Atlas can run `prettier` over the touched `.vue` and `.ts` files, ensuring your Nuxt codebase adheres to your project's formatting standards.

### Can Atlas help move data fetching in Nuxt components?

Yes, Atlas can be asked to move a `fetch` out of a Nuxt component into `useAsyncData` so it runs once during SSR instead of twice, optimizing performance.

### How does Atlas integrate with Nuxt's testing setup?

Atlas integrates with `vitest` through `@nuxt/test-utils`, allowing it to add regression tests for Nuxt bugs and cover new Nitro route handlers with tests.

### Is my Nuxt code sent to third-party servers for indexing?

No, Atlas can build its code index with local Ollama embeddings, keeping your Nuxt code off third-party servers and ensuring privacy.

---

Canonical HTML: https://runatlas.sh/resources/stacks/trace-a-runtime-bug-from-a-stack-trace-in-nuxt
Source of truth: aeo_pages row `/resources/stacks/trace-a-runtime-bug-from-a-stack-trace-in-nuxt` (segment: Stacks) (this file is generated from it, never hand-edited).
Licence: Atlas is proprietary with a free core. It is not open source and there is no public source repository.
