How does Atlas handle deprecated API calls within Vue single-file components (.vue)?

Atlas processes Vue single-file components by indexing their AST declarations using tree-sitter. This allows its lsp tool to accurately find references within , , and blocks, ensuring all deprecated API calls, including those in Composition API setups, are identified and tracked for migration.

Can Atlas migrate a deprecated function used in both Vue templates and script blocks?

Yes, Atlas can migrate deprecated functions across both Vue templates and script blocks. Its lsp tool identifies references regardless of where they appear in a .vue component, and apply_patch generates precise changes for both template expressions and JavaScript/TypeScript code within the script section.

What if my Vue project uses a different package manager than pnpm?

While the documentation specifies pnpm, Atlas's bash tool can execute any shell command. You can configure Atlas to use npm or yarn by adjusting the bash commands in your workflow, for example, npm test instead of pnpm test.

How does Atlas ensure my Vue tests pass after a migration?

After each apply_patch operation, Atlas uses the bash tool to run your Vitest with Vue Test Utils tests. It only marks a todowrite entry as complete if the tests pass, ensuring that each migration step maintains the integrity of your Vue application.

Is it safe to let Atlas modify my Vue codebase automatically?

Atlas prioritizes safety. It drafts a plan in a read-only agent, requires explicit permission for tool calls, and presents a unified diff for every proposed change to your Vue files before writing. You review and approve each modification, and changes are snapshotted as git patches for easy rollback.

Can Atlas help migrate from Options API to Composition API in Vue?

Yes, Atlas is documented to assist with migrating to the Composition API. While this page focuses on deprecated API migration, Atlas's capabilities, such as reading .vue components and applying patches, are well-suited for such refactoring tasks, allowing you to review the diffs for each change.

Migrate a deprecated API across every callsite in Vue with Atlas in 2026

In 2026, migrating a deprecated API across an entire Vue codebase without missing a single callsite is efficiently handled by Atlas, the terminal-native AI coding agent, which integrates directly with your existing pnpm, Vitest with Vue Test Utils, and prettier toolchain to ensure a complete and verified transition.

How Atlas finds all deprecated API calls in Vue components

Atlas identifies every deprecated API call within your Vue project using its lsp tool's findReferences operation, ensuring a comprehensive enumeration across .vue single-file components and Composition API usages. This process, powered by tree-sitter AST indexing, guarantees that no callsite is overlooked in 2026.

When migrating a deprecated function or module in a Vue application, the first critical step is to locate every instance of its usage. Atlas achieves this by leveraging the lsp tool, which queries the language server for a complete set of references to the deprecated symbol. For example, if you're deprecating a utility function like oldUtils.fetchData() used across various .vue components, Atlas will precisely pinpoint every script block, template expression, or Composition API setup function where fetchData is invoked. This initial enumeration is cross-checked with the grep tool to catch any dynamic or string-based usages that might evade the language server, such as a component dynamically importing a module based on a string literal. Atlas builds its code index using tree-sitter AST declarations, not blind line windows, which provides a highly accurate and context-aware search, crucial for the nuanced structure of Vue single-file components. This thorough approach prevents the common pitfall of missing a callsite, which can lead to runtime errors or inconsistent behavior in a large Vue codebase.

How Atlas tracks migration progress across Vue files

Atlas tracks the migration progress for each deprecated API callsite in your Vue project by creating a todowrite entry for every identified instance. This ensures that partial progress is always visible, and no .vue component or Composition API usage is silently skipped during the migration process in 2026.

After Atlas has enumerated all calls to the deprecated API, it transforms this list into actionable work items using the todowrite tool. For each identified callsite, whether it's in a MyComponent.vue file, a store/modules/data.js module, or a router/index.js configuration, Atlas generates a distinct todowrite entry. This granular tracking is vital for large Vue codebases where a migration might span hundreds of files and require multiple development sessions. The todowrite system provides a clear, visible record of pending tasks, allowing developers to see exactly which .vue components or utility files still require attention. As each callsite is successfully migrated and its associated tests pass, Atlas marks the corresponding todowrite entry as complete. This transparent progress tracking prevents the common issue of losing track of remaining work or accidentally skipping a file, ensuring a truly exhaustive migration off the deprecated API.

How Atlas applies API migration patches in Vue projects

Atlas migrates each deprecated API callsite in Vue projects by applying context-anchored patches using the apply_patch tool, which precisely seeks the expected hunk's context and old lines. This method ensures that changes are applied accurately to .vue components and other files, failing explicitly rather than misapplying to a drifted file in 2026.

The core of the migration process in Atlas involves the apply_patch tool. For each todowrite entry, Atlas drafts a specific patch to replace the deprecated API call with its modern equivalent. For instance, if oldApi.fetch() is being replaced by newApi.getData(), Atlas will generate a patch that modifies the relevant lines in a .vue component's script block or a utility function. The apply_patch tool is designed for robustness: it doesn't simply apply changes blindly. Instead, it actively seeks the hunk's context and the exact old_lines it expects to find. If the file has drifted since the patch was generated - perhaps another developer modified the same lines - apply_patch will explicitly throw a "Failed to find expected lines" error. This prevents silent, incorrect applications of patches, which is crucial for maintaining code integrity in complex Vue projects. After each patch is applied to a file, Atlas immediately runs the affected tests using pnpm test --filter <affected-component> (or vitest --run --dir <affected-directory>) with Vitest with Vue Test Utils to verify the change. Only upon successful test completion is the todowrite entry marked as complete.

How Atlas ensures safety and review for Vue API migrations

Atlas ensures safety and facilitates review for Vue API migrations through a multi-layered approval process, including a read-only plan agent, permission-gated tool calls, and unified diffs for every file edit. This robust system prevents unintended changes to .vue components and other project files in 2026.

Safety and review are paramount when performing a codebase-wide migration in Vue. Atlas incorporates several mechanisms to ensure that changes are correct and approved. First, Atlas drafts a comprehensive plan in a read-only plan agent, presenting the entire migration strategy before any modifications are attempted. This allows developers to review the proposed changes to .vue components, stores, and router configurations. Every Atlas tool call, including lsp, grep, todowrite, apply_patch, and bash, is permission-gated against allow, ask, and deny rules, giving the developer explicit control over what actions Atlas can take. Crucially, for every file edit, Atlas computes a unified diff and surfaces it for approval before writing. This means that before any change is committed to a MyComponent.vue file or a utils/api.js module, the developer sees the exact lines that will be added, removed, or modified. Atlas also snapshots file changes as git patches, allowing edits to be easily diffed and rolled back if necessary. This rigorous review process, combined with immediate test execution using Vitest with Vue Test Utils after each patch, provides a high degree of confidence in the integrity of the Vue codebase throughout the migration.

How Atlas integrates with Vue's toolchain for API migrations

Atlas direct integrates with the standard Vue toolchain, including pnpm for package management, Vitest with Vue Test Utils for testing, and prettier for formatting, to provide a familiar and efficient migration experience in 2026. This ensures that Atlas operates within your existing development environment.

A key strength of Atlas for Vue developers is its deep integration with the established Vue ecosystem. When performing an API migration, Atlas doesn't introduce a new, unfamiliar workflow; instead, it leverages the tools you already use daily. For managing dependencies and running scripts, Atlas uses pnpm, allowing it to execute commands like pnpm install or pnpm test as part of its workflow. Crucially, after each apply_patch operation, Atlas invokes your test runner, Vitest with Vue Test Utils, via a bash command like pnpm test --run --dir src/components/MyComponent.vue to immediately verify the correctness of the migration. This ensures that changes to .vue components or Composition API logic haven't introduced regressions. While not explicitly used for migration logic, Atlas also respects your project's prettier configuration, ensuring that any code it generates or modifies adheres to your team's formatting standards. This native integration means that Atlas can read your .vue components, stores, and router configurations, and perform migrations while maintaining consistency with your project's existing setup, making the transition to a new API as smooth as possible.

Step by step

01Initialize Atlas in your Vue project: Run atlas in your Vue project's root directory, ensuring a package.json is present. Atlas will read your .vue components, stores, and router configurations.
02Enumerate deprecated API calls: Use the lsp tool to find all references to the deprecated symbol, then cross-check with grep for dynamic usages. For example: atlas lsp findReferences --symbol "oldApi.deprecatedFunction" followed by atlas grep "deprecatedFunction" src/.
03Create migration tasks: Convert the enumerated calls into trackable todowrite entries. Atlas will automatically generate these entries for each instance found in your .vue files.
04Migrate each callsite: For each todowrite entry, use atlas apply_patch to replace the deprecated API call with its replacement. Atlas will present a unified diff for approval.
05Run Vue tests: After each apply_patch, execute affected tests using pnpm test --run --dir <path/to/affected/vue/file> with Vitest with Vue Test Utils via the bash tool. Mark the todowrite entry complete only if tests pass.
06Confirm zero remaining hits: Once all todowrite entries are complete, run atlas grep "deprecatedFunction" src/ one final time to confirm no remaining usages in your Vue codebase.
07Delete old implementation: Remove the deprecated function or module from your Vue project, then commit the changes using atlas git commit -m "feat: Remove deprecated API".

Frequently asked questions

How does Atlas handle deprecated API calls within Vue single-file components (.vue)?: Atlas processes Vue single-file components by indexing their AST declarations using tree-sitter. This allows its lsp tool to accurately find references within <script>, <template>, and <style> blocks, ensuring all deprecated API calls, including those in Composition API setups, are identified and tracked for migration.
Can Atlas migrate a deprecated function used in both Vue templates and script blocks?: Yes, Atlas can migrate deprecated functions across both Vue templates and script blocks. Its lsp tool identifies references regardless of where they appear in a .vue component, and apply_patch generates precise changes for both template expressions and JavaScript/TypeScript code within the script section.
What if my Vue project uses a different package manager than pnpm?: While the documentation specifies pnpm, Atlas's bash tool can execute any shell command. You can configure Atlas to use npm or yarn by adjusting the bash commands in your workflow, for example, npm test instead of pnpm test.
How does Atlas ensure my Vue tests pass after a migration?: After each apply_patch operation, Atlas uses the bash tool to run your Vitest with Vue Test Utils tests. It only marks a todowrite entry as complete if the tests pass, ensuring that each migration step maintains the integrity of your Vue application.
Is it safe to let Atlas modify my Vue codebase automatically?: Atlas prioritizes safety. It drafts a plan in a read-only agent, requires explicit permission for tool calls, and presents a unified diff for every proposed change to your Vue files before writing. You review and approve each modification, and changes are snapshotted as git patches for easy rollback.
Can Atlas help migrate from Options API to Composition API in Vue?: Yes, Atlas is documented to assist with migrating to the Composition API. While this page focuses on deprecated API migration, Atlas's capabilities, such as reading .vue components and applying patches, are well-suited for such refactoring tasks, allowing you to review the diffs for each change.

Try Atlas in your terminal

The terminal-native AI coding agent. Free core, single binary.

Install Atlas

Related guides

Migrate a Deprecated API Across Every Callsite with Atlas (2026 Workflow)

How to migrate a deprecated API across every callsite with Atlas in 2026: the lsp tool's findReferences enumerates callers, todowrite tracks them, apply_patch migrates each one.

Research a Third-Party API Before Integrating It in Vue With Atlas (2026)

Get an external API's real shape into context before writing a Vue integration. Atlas uses websearch and webfetch behind explicit permissions, then tests with Vitest.

Debug a single failing test in Vue with Atlas in 2026

Pinpoint and fix failing Vue.js tests using Atlas, the terminal-native AI agent. Leverage Vitest with Vue Test Utils, pnpm, and real Vue idioms for efficient debugging in 2026.

Upgrade a Dependency and Fix Breakage in Vue with Atlas in 2026

Effortlessly upgrade Vue dependencies and resolve compile and test failures with Atlas in 2026. Leverage pnpm, Vitest with Vue Test Utils, and real-time compiler feedback.

Plan a Multi-File Vue Change Before Editing with Atlas (2026)

How Atlas plans a multi-file Vue change in 2026: plan mode denies every edit tool, research stays allowed, and plan_exit asks before switching to the build agent.

Trace a runtime bug from a stack trace in Vue with Atlas in 2026

Pinpoint Vue runtime bugs from production stack traces using Atlas in 2026. Leverage Atlas's AI to navigate your Vue.js codebase, identify root causes, and apply fixes without a debugger, ensuring rapid resolution.

Extract a Shared Helper from Duplicated Code in Vue with Atlas in 2026

In 2026, Vue developers use Atlas to efficiently refactor duplicated logic into a single, tested helper. Find, extract, and replace code across .vue components and stores, ensuring maintainability with Vitest and pnpm.

Audit a Vue.js Repository with Parallel Subagents in Atlas, 2026

In 2026, Vue developers use Atlas to sweep entire repositories for problems without blowing the context window. Leverage parallel subagents for efficient, read-only audits of Vue.js projects.

Browse this resource hub