[System] You are a VTEX documentation expert. You provide accurate, detailed information about VTEX platform, APIs, apps, and Store Framework development.

[User] Provide a guide on guides vtex io documentation vtex io cli uninstall in VTEX.

[Assistant]
Documentation

[Feedback](https://read.calvincode.net/reader?url=https://docs.google.com/forms/d/e/1FAIpQLSfmnotPvPjw-SjiE7lt2Nt3RQgNUe10ixXZmuO2v9enOJReoQ/viewform?entry.1972292648=developers.vtex.com%26entry.1799503232=)

[GuidesLearn how to use our APIs and extend the VTEX platform.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-vtex-io-cli-uninstall/docs/guides)

[API ReferenceExplore detailed information about our endpoints.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-vtex-io-cli-uninstall/docs/api-reference)

[App DevelopmentLearn how to build cloud-based apps and integrations.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-vtex-io-cli-uninstall/docs/app-development)

[Storefront DevelopmentExpress your brand identity creating unique storefronts.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-vtex-io-cli-uninstall/docs/storefront-development)

[VTEX IO AppsFind pre-built solutions to grow your business.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-vtex-io-cli-uninstall/docs/vtex-io-apps)

[TroubleshootingFind practical solutions to common development issues.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-vtex-io-cli-uninstall/docs/troubleshooting)

[Release NotesStay up to date with our latest releases and bug fixes.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-vtex-io-cli-uninstall/updates/release-notes)

App Development

[What is VTEX IO](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-vtex-io-cli-uninstall/docs/guides/vtex-io-documentation-what-is-vtex-io)

---

[What is a VTEX App](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-vtex-io-cli-uninstall/docs/guides/vtex-io-documentation-what-is-a-vtex-app)

---

[Governance and shared security in VTEX IO apps](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-vtex-io-cli-uninstall/docs/guides/governance-and-shared-security-in-vtex-io-apps)

---

[Code samples and templates](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-vtex-io-cli-uninstall/docs/guides/code-samples)

---

[Getting Started](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-vtex-io-cli-uninstall/docs/guides/vtex-io-getting-started)

---

Project structure

---

[VTEX IO CLI](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-vtex-io-cli-uninstall/docs/guides/vtex-io-documentation-vtex-io-cli-installation-and-command-reference)

[Installing VTEX IO CLI](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-vtex-io-cli-uninstall/docs/guides/vtex-io-documentation-vtex-io-cli-install)

[Updating VTEX IO's CLI](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-vtex-io-cli-uninstall/docs/guides/vtex-io-documentation-vtex-io-cli-update)

[Using VTEX IO's CLI](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-vtex-io-cli-uninstall/docs/guides/vtex-io-documentation-vtex-io-cli-usage)

[Managing plugins](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-vtex-io-cli-uninstall/docs/guides/vtex-io-documentation-vtex-io-cli-plugins)

[Command reference](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-vtex-io-cli-uninstall/docs/guides/vtex-io-documentation-vtex-io-cli-command-reference)

[Uninstalling VTEX IO's CLI](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-vtex-io-cli-uninstall/docs/guides/vtex-io-documentation-vtex-io-cli-uninstall)

---

[Workspace](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-vtex-io-cli-uninstall/docs/guides/vtex-io-documentation-workspace)

---

Managing apps

---

Development guides

---

[Node apps](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-vtex-io-cli-uninstall/docs/guides/app-development-guides)

---

[GraphQL in VTEX IO](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-vtex-io-cli-uninstall/docs/guides/graphql-in-vtex-io)

---

[Policies and permissions](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-vtex-io-cli-uninstall/docs/guides/vtex-io-documentation-policies)

---

[A/B tests](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-vtex-io-cli-uninstall/docs/guides/ab-tests)

---

[Deployment](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-vtex-io-cli-uninstall/docs/guides/vtex-io-documentation-making-your-new-app-version-publicly-available)

---

[VTEX App Store](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-vtex-io-cli-uninstall/docs/guides/vtex-app-store)

---

[Edition Apps](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-vtex-io-cli-uninstall/docs/guides/managing-edition-apps)

---

[Frequently asked questions](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-vtex-io-cli-uninstall/docs/guides/vtex-io-documentation-frequently-asked-questions)

---

[Guides](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-vtex-io-cli-uninstall/docs/guides)

[API Reference](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-vtex-io-cli-uninstall/docs/api-reference)

[App Development](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-vtex-io-cli-uninstall/docs/app-development)

[Storefront Development](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-vtex-io-cli-uninstall/docs/storefront-development)

[VTEX IO Apps](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-vtex-io-cli-uninstall/docs/vtex-io-apps)

[Troubleshooting](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-vtex-io-cli-uninstall/docs/troubleshooting)

---

[Release Notes](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-vtex-io-cli-uninstall/updates/release-notes)

App Development

[What is VTEX IO](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-vtex-io-cli-uninstall/docs/guides/vtex-io-documentation-what-is-vtex-io)

---

[What is a VTEX App](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-vtex-io-cli-uninstall/docs/guides/vtex-io-documentation-what-is-a-vtex-app)

---

[Governance and shared security in VTEX IO apps](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-vtex-io-cli-uninstall/docs/guides/governance-and-shared-security-in-vtex-io-apps)

---

[Code samples and templates](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-vtex-io-cli-uninstall/docs/guides/code-samples)

---

[Getting Started](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-vtex-io-cli-uninstall/docs/guides/vtex-io-getting-started)

---

Project structure

---

[VTEX IO CLI](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-vtex-io-cli-uninstall/docs/guides/vtex-io-documentation-vtex-io-cli-installation-and-command-reference)

[Installing VTEX IO CLI](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-vtex-io-cli-uninstall/docs/guides/vtex-io-documentation-vtex-io-cli-install)

[Updating VTEX IO's CLI](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-vtex-io-cli-uninstall/docs/guides/vtex-io-documentation-vtex-io-cli-update)

[Using VTEX IO's CLI](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-vtex-io-cli-uninstall/docs/guides/vtex-io-documentation-vtex-io-cli-usage)

[Managing plugins](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-vtex-io-cli-uninstall/docs/guides/vtex-io-documentation-vtex-io-cli-plugins)

[Command reference](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-vtex-io-cli-uninstall/docs/guides/vtex-io-documentation-vtex-io-cli-command-reference)

[Uninstalling VTEX IO's CLI](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-vtex-io-cli-uninstall/docs/guides/vtex-io-documentation-vtex-io-cli-uninstall)

---

[Workspace](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-vtex-io-cli-uninstall/docs/guides/vtex-io-documentation-workspace)

---

Managing apps

---

Development guides

---

[Node apps](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-vtex-io-cli-uninstall/docs/guides/app-development-guides)

---

[GraphQL in VTEX IO](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-vtex-io-cli-uninstall/docs/guides/graphql-in-vtex-io)

---

[Policies and permissions](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-vtex-io-cli-uninstall/docs/guides/vtex-io-documentation-policies)

---

[A/B tests](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-vtex-io-cli-uninstall/docs/guides/ab-tests)

---

[Deployment](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-vtex-io-cli-uninstall/docs/guides/vtex-io-documentation-making-your-new-app-version-publicly-available)

---

[VTEX App Store](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-vtex-io-cli-uninstall/docs/guides/vtex-app-store)

---

[Edition Apps](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-vtex-io-cli-uninstall/docs/guides/managing-edition-apps)

---

[Frequently asked questions](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-vtex-io-cli-uninstall/docs/guides/vtex-io-documentation-frequently-asked-questions)

---

[App Development](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-vtex-io-cli-uninstall/docs/app-development)

[VTEX IO CLI](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-vtex-io-cli-uninstall/docs/guides/vtex-io-documentation-vtex-io-cli-installation-and-command-reference)

[Uninstalling VTEX IO's CLI](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-vtex-io-cli-uninstall/docs/guides/vtex-io-documentation-vtex-io-cli-uninstall)

Uninstalling VTEX IO's CLI

Learn how to uninstall VTEX IO's CLI from your computer.

To uninstall VTEX IO's CLI from your system, run the command relative to your operating system or package manager.

> This will also remove all [plugins](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-vtex-io-cli-plugins) from your system.

## MacOS

`1

brew uninstall vtex

`

## Linux

`1

curl -L https://vtex.io/vtexcli/uninstall | sh

`

> The standalone is a tarball with a binary that contains its node.js binary.

## Windows

Follow the [Windows uninstall tutorial](https://read.calvincode.net/reader?url=https://support.microsoft.com/en-us/windows/uninstall-or-remove-apps-and-programs-in-windows-10-4b55f974-2cc6-2d2b-d092-5905080eaf98) to remove the VTEX IO's CLI from your programs list.

## Uninstalling VTEX IO's CLI via NPM

If you have [installed VTEX IO's CLI via NPM](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-vtex-io-cli-install), to uninstall it on your machine, run the following command:

`1

yarn global remove vtex

`

Contributors

1

[![Photo of the contributor](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-vtex-io-cli-uninstall/_next/image?url=https%3A%2F%2Favatars.githubusercontent.com%2Fu%2F60782333%3Fv%3D4%26w=64%26q=75)](https://github.com/carolinamenezes)

Was this helpful?

Yes

No

[Suggest Edits (GitHub)](https://read.calvincode.net/reader?url=https://github.com/vtexdocs/dev-portal-content/edit/main/docs/guides/vtex-io/Reference/vtex-io-documentation-vtex-io-cli-installation-and-command-reference/vtex-io-documentation-vtex-io-cli-uninstall.md)

[Command reference« Previous](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-vtex-io-cli-uninstall//docs/guides/vtex-io-documentation-vtex-io-cli-command-reference)[WorkspaceNext »](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-vtex-io-cli-uninstall//docs/guides/vtex-io-documentation-workspace)

Contributors

1

[![Photo of the contributor](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-vtex-io-cli-uninstall/_next/image?url=https%3A%2F%2Favatars.githubusercontent.com%2Fu%2F60782333%3Fv%3D4%26w=64%26q=75)](https://github.com/carolinamenezes)

ON THIS PAGE

[MacOS](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-vtex-io-cli-uninstall/docs/guides/vtex-io-documentation-vtex-io-cli-uninstall%23macos)

[Linux](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-vtex-io-cli-uninstall/docs/guides/vtex-io-documentation-vtex-io-cli-uninstall%23linux)

[Windows](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-vtex-io-cli-uninstall/docs/guides/vtex-io-documentation-vtex-io-cli-uninstall%23windows)

[Uninstalling VTEX IO's CLI via NPM](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-vtex-io-cli-uninstall/docs/guides/vtex-io-documentation-vtex-io-cli-uninstall%23uninstalling-vtex-ios-cli-via-npm)

Was this helpful?

 Send feedback

[Suggest edits (GitHub)](https://read.calvincode.net/reader?url=https://github.com/vtexdocs/dev-portal-content/edit/main/docs/guides/vtex-io/Reference/vtex-io-documentation-vtex-io-cli-installation-and-command-reference/vtex-io-documentation-vtex-io-cli-uninstall.md)

Copy page

On this page

ON THIS PAGE

[MacOS](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-vtex-io-cli-uninstall/docs/guides/vtex-io-documentation-vtex-io-cli-uninstall%23macos)

[Linux](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-vtex-io-cli-uninstall/docs/guides/vtex-io-documentation-vtex-io-cli-uninstall%23linux)

[Windows](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-vtex-io-cli-uninstall/docs/guides/vtex-io-documentation-vtex-io-cli-uninstall%23windows)

[Uninstalling VTEX IO's CLI via NPM](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-vtex-io-cli-uninstall/docs/guides/vtex-io-documentation-vtex-io-cli-uninstall%23uninstalling-vtex-ios-cli-via-npm)

On this page

[Github](https://read.calvincode.net/reader?url=https://github.com/vtex-apps)[Help Center](https://read.calvincode.net/reader?url=https://help.vtex.com/)[Community](https://read.calvincode.net/reader?url=https://community.vtex.com/?%5Fga=2.198523433.743584735.1647618303-1974737580.1645714642)[Feedback](https://read.calvincode.net/reader?url=https://docs.google.com/forms/d/e/1FAIpQLSfmnotPvPjw-SjiE7lt2Nt3RQgNUe10ixXZmuO2v9enOJReoQ/viewform?entry.1972292648=developers.vtex.com%26entry.1799503232=)


[System] You are a VTEX documentation expert. You provide accurate, detailed information about VTEX platform, APIs, apps, and Store Framework development.

[User] How do I use the VTEX abandoned cart service app? Provide documentation and configuration details.

[Assistant]
Documentation

[Feedback](https://read.calvincode.net/reader?url=https://docs.google.com/forms/d/e/1FAIpQLSfmnotPvPjw-SjiE7lt2Nt3RQgNUe10ixXZmuO2v9enOJReoQ/viewform?entry.1972292648=developers.vtex.com%26entry.1799503232=)

[GuidesLearn how to use our APIs and extend the VTEX platform.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.abandoned-cart-service/docs/guides)

[API ReferenceExplore detailed information about our endpoints.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.abandoned-cart-service/docs/api-reference)

[App DevelopmentLearn how to build cloud-based apps and integrations.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.abandoned-cart-service/docs/app-development)

[Storefront DevelopmentExpress your brand identity creating unique storefronts.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.abandoned-cart-service/docs/storefront-development)

[VTEX IO AppsFind pre-built solutions to grow your business.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.abandoned-cart-service/docs/vtex-io-apps)

[TroubleshootingFind practical solutions to common development issues.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.abandoned-cart-service/docs/troubleshooting)

[Release NotesStay up to date with our latest releases and bug fixes.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.abandoned-cart-service/updates/release-notes)

VTEX IO Apps

[Basic components](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.abandoned-cart-service/docs/guides/basic-components)

---

[Store Components](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.abandoned-cart-service/docs/guides/store-components)

---

[Advanced components](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.abandoned-cart-service/docs/guides/advanced-components)

---

[B2B components](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.abandoned-cart-service/docs/guides/b2b-components)

---

[B2B Suite](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.abandoned-cart-service/docs/apps/vtex.b2b-suite)

---

[Functional Apps](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.abandoned-cart-service/docs/guides/functional-apps)

[AB Tester](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.abandoned-cart-service/docs/apps/vtexarg.abtester)

[Abandoned Cart Service](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.abandoned-cart-service/docs/apps/vtex.abandoned-cart-service)

[Badges](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.abandoned-cart-service/docs/apps/vtex.badges)

[Broadcaster](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.abandoned-cart-service/docs/apps/vtex.broadcaster)

[Catalog Images](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.abandoned-cart-service/docs/apps/vtex.catalog-images)

[Checkout UI Custom](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.abandoned-cart-service/docs/apps/vtex.checkout-ui-custom)

[Checkout UI Settings](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.abandoned-cart-service/docs/apps/vtex.checkout-ui-settings)

[Messages](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.abandoned-cart-service/docs/apps/vtex.messages)

[Product Context](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.abandoned-cart-service/docs/apps/vtex.product-context)

[Pickup point selector](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.abandoned-cart-service/docs/apps/vtexbr.pickup-selector)

[Rewriter](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.abandoned-cart-service/docs/apps/vtex.rewriter)

[Responsive Values](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.abandoned-cart-service/docs/apps/vtex.responsive-values)

[Search GraphQL](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.abandoned-cart-service/docs/apps/vtex.search-graphql)

[Session Client](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.abandoned-cart-service/docs/apps/vtex.session-client)

[Store Icons](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.abandoned-cart-service/docs/apps/vtex.store-icons)

[Store Sitemap](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.abandoned-cart-service/docs/apps/vtex.store-sitemap)

[VTEX Telemarketing](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.abandoned-cart-service/docs/apps/vtex.telemarketing)

[Assembly Options](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.abandoned-cart-service/docs/guides/assembly-options-app)

[Affiliates Program](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.abandoned-cart-service/docs/guides/affiliates-program-app)

---

[Layout Apps](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.abandoned-cart-service/docs/guides/layout-apps)

---

[Pixel Apps](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.abandoned-cart-service/docs/guides/pixel-apps)

---

[My Account - StoreV2 version](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.abandoned-cart-service/docs/apps/vtex.my-account)

---

[VTEX IO deprecated apps](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.abandoned-cart-service/docs/guides/vtex-io-deprecated-apps)

---

[Guides](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.abandoned-cart-service/docs/guides)

[API Reference](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.abandoned-cart-service/docs/api-reference)

[App Development](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.abandoned-cart-service/docs/app-development)

[Storefront Development](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.abandoned-cart-service/docs/storefront-development)

[VTEX IO Apps](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.abandoned-cart-service/docs/vtex-io-apps)

[Troubleshooting](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.abandoned-cart-service/docs/troubleshooting)

---

[Release Notes](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.abandoned-cart-service/updates/release-notes)

VTEX IO Apps

[Basic components](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.abandoned-cart-service/docs/guides/basic-components)

---

[Store Components](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.abandoned-cart-service/docs/guides/store-components)

---

[Advanced components](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.abandoned-cart-service/docs/guides/advanced-components)

---

[B2B components](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.abandoned-cart-service/docs/guides/b2b-components)

---

[B2B Suite](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.abandoned-cart-service/docs/apps/vtex.b2b-suite)

---

[Functional Apps](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.abandoned-cart-service/docs/guides/functional-apps)

[AB Tester](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.abandoned-cart-service/docs/apps/vtexarg.abtester)

[Abandoned Cart Service](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.abandoned-cart-service/docs/apps/vtex.abandoned-cart-service)

[Badges](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.abandoned-cart-service/docs/apps/vtex.badges)

[Broadcaster](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.abandoned-cart-service/docs/apps/vtex.broadcaster)

[Catalog Images](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.abandoned-cart-service/docs/apps/vtex.catalog-images)

[Checkout UI Custom](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.abandoned-cart-service/docs/apps/vtex.checkout-ui-custom)

[Checkout UI Settings](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.abandoned-cart-service/docs/apps/vtex.checkout-ui-settings)

[Messages](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.abandoned-cart-service/docs/apps/vtex.messages)

[Product Context](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.abandoned-cart-service/docs/apps/vtex.product-context)

[Pickup point selector](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.abandoned-cart-service/docs/apps/vtexbr.pickup-selector)

[Rewriter](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.abandoned-cart-service/docs/apps/vtex.rewriter)

[Responsive Values](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.abandoned-cart-service/docs/apps/vtex.responsive-values)

[Search GraphQL](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.abandoned-cart-service/docs/apps/vtex.search-graphql)

[Session Client](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.abandoned-cart-service/docs/apps/vtex.session-client)

[Store Icons](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.abandoned-cart-service/docs/apps/vtex.store-icons)

[Store Sitemap](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.abandoned-cart-service/docs/apps/vtex.store-sitemap)

[VTEX Telemarketing](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.abandoned-cart-service/docs/apps/vtex.telemarketing)

[Assembly Options](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.abandoned-cart-service/docs/guides/assembly-options-app)

[Affiliates Program](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.abandoned-cart-service/docs/guides/affiliates-program-app)

---

[Layout Apps](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.abandoned-cart-service/docs/guides/layout-apps)

---

[Pixel Apps](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.abandoned-cart-service/docs/guides/pixel-apps)

---

[My Account - StoreV2 version](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.abandoned-cart-service/docs/apps/vtex.my-account)

---

[VTEX IO deprecated apps](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.abandoned-cart-service/docs/guides/vtex-io-deprecated-apps)

---

[VTEX IO Apps](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.abandoned-cart-service/docs/vtex-io-apps)

[Functional Apps](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.abandoned-cart-service/docs/guides/functional-apps)

Abandoned Cart Service

Official extension

Version: 3.1.6

Latest version: 3.1.6

## ⚠ Maintenance ⚠

_Starting June 1st 2023, this application will no longer be maintained by VTEX._

---

The Abandoned Cart Service app can be used to trigger abandoned cart emails.

## Installation

Open the terminal and run the following command:

`1

vtex install vtex.abandoned-cart-service

`

## Usage

Follow the [Setting up Cart Abandonment (Trigger)](https://read.calvincode.net/reader?url=https://help.vtex.com/tutorial/setting-up-abandoned-carts--tutorials%5F740) guide, but in the **Action** tab, select **Send an HTTP Request** with the following configuration:

* **URL:** `https://{accountName}.myvtex.com/_v/abandoned-cart`.
* **Method:** POST.
* **Header:**
`1
content-type: application/json
2
accept: application/json
`
* Content as JSON field:
`1
{
2
 "email": "{!email}",
3
 "skuURL": "{!rclastcart}",
4
 "template": "vtexcommerce-abandoned-cart",
5
 "additionalFields": {
6
 // In object you can add any additional field to send in the mail
7
 "firstName": "{!firstName}"
8
 }
9
}
`

![{"base64":"  ","img":{"width":1159,"height":627,"type":"png","mime":"image/png","wUnits":"px","hUnits":"px","length":47107,"url":"https://user-images.githubusercontent.com/67066494/184005464-d06e1cda-3b21-42ec-b020-d85d684e6b7c.png"}}](https://read.calvincode.net/reader?url=https://user-images.githubusercontent.com/67066494/184005464-d06e1cda-3b21-42ec-b020-d85d684e6b7c.png)

> The template field in the JSON above depends on the template `id` configured in the Message Center.

The app installation should automatically generate a new template in the message center with the `id` `vtexcommerce-abandoned-cart`, which can be edited to create the desired template. To style the email, the following JSON can be used as an example of JSON Data:

`1

{

2

 "email": "teste@vtex.com.br",

3

 "items": [

4

 {

5

 "id": "880010",

6

 "productName": "adidas Men's Performance Polo - Blast Blue S",

7

 "image": "https://bibi.vteximg.com.br/arquivos/ids/155405/adidas-mens-performance-polo-blast-blue.jpg?v=637947886549170000",

8

 "sellingPrice": "455.00",

9

 "quantity": "1",

10

 "link": "adidas-mens-performance-polo-blast-blue",

11

 "availabilityQuantity": 1000000

12

 }

13

 ],

14

 "addToCartURL": "add?sku=880010&qty=1&seller=1&sc=1",

15

 "additionalFields": {

16

 "firstName": "Teste VTEX"

17

 },

18

 "_accountInfo": {

19

 "MainAccountName": "teste",

20

 "AccountName": "teste",

21

 "Cnpj": null,

22

 "Id": "278fe15c-f0eb-4c30-81a2-f42b29113f1a",

23

 "AppId": null,

24

 "IsActive": true,

25

 "IsOperating": false,

26

 "CreationDate": "2022-06-21T19:58:01.3387095Z",

27

 "OperationDate": null,

28

 "CompanyName": "Companhia Brasileira de Tecnologia para ecommerce",

29

 "TradingName": "VTEX",

30

 "City": null,

31

 "Complement": null,

32

 "Country": null,

33

 "State": null,

34

 "Address": null,

35

 "District": null,

36

 "Number": null,

37

 "PostalCode": null,

38

 "Licenses": [

39

 7

40

 ],

41

 "ParentAccountId": null,

42

 "ParentAccountName": null,

43

 "InactivationDate": null,

44

 "Platform": "vtex",

45

 "Privacy": null,

46

 "HasPiiRestriction": false,

47

 "Infra": null

48

 }

49

}

`

Use the following template as an example:

`1

<!DOCTYPE html

2

PUBLIC"-//W3C//DTD XHTML 1.0 Transitional //EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

3

6

7

8

<meta http-equiv="Content-Type" content="text/html;charset=UTF-8"/>

9

<meta http-equiv="X-UA-Compatible" content="IE=edge" />

10

<meta name="viewport" content="width=device-width, initial-scale=1.0"/>

11

<title>{{_accountInfo.TradingName}}</title>

12

13

23

32

59

60

61

63

65

66

68

71

72

73

76

78

79

82

</>

83

84

Abandoned Cart

85

86

87

88

89

92

93

94

96

97

98

99

{{#each items}}

100

101

105

106

109

{{productName}}

111

112

{{quantity}} un.

113

{{#if sellingPrice}}

114

${{formatCurrency sellingPrice}}

115

{{else}}

116

Grátis

117

{{/if}}

118

119

120

121

{{/each}}

122

123

124

125

126

127

128

129

132

Link to the cart

133

134

135

136

137

138

139

140

141

142

`

The `addToCartURL` variable is formatted to work with the [cart URL](https://read.calvincode.net/reader?url=https://help.vtex.com/tutorial/how-to-assemble-the-cart-url--u3Tj5wagnukYwG84IQU06). Its purpose is to send the user back to the checkout with the items in the abandoned cart.

[AB Tester« Previous](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.abandoned-cart-service/docs/apps/vtexarg.abtester)[BadgesNext »](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.abandoned-cart-service/docs/apps/vtex.badges)

See also

[VTEX App StoreVTEX IO Apps](https://read.calvincode.net/reader?url=https://apps.vtex.com/)

ON THIS PAGE

[⚠ Maintenance ⚠](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.abandoned-cart-service/docs/apps/vtex.abandoned-cart-service%23-maintenance-)

[Installation](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.abandoned-cart-service/docs/apps/vtex.abandoned-cart-service%23installation)

[Usage](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.abandoned-cart-service/docs/apps/vtex.abandoned-cart-service%23usage)

Was this helpful?

[Github](https://read.calvincode.net/reader?url=https://github.com/vtex-apps)[Help Center](https://read.calvincode.net/reader?url=https://help.vtex.com/)[Community](https://read.calvincode.net/reader?url=https://community.vtex.com/?%5Fga=2.198523433.743584735.1647618303-1974737580.1645714642)[Feedback](https://read.calvincode.net/reader?url=https://docs.google.com/forms/d/e/1FAIpQLSfmnotPvPjw-SjiE7lt2Nt3RQgNUe10ixXZmuO2v9enOJReoQ/viewform?entry.1972292648=developers.vtex.com%26entry.1799503232=)


[System] You are a VTEX documentation expert. You provide accurate, detailed information about VTEX platform, APIs, apps, and Store Framework development.

[User] Provide a guide on guides vtex io documentation using the assets builder in VTEX.

[Assistant]
Documentation

[Feedback](https://read.calvincode.net/reader?url=https://docs.google.com/forms/d/e/1FAIpQLSfmnotPvPjw-SjiE7lt2Nt3RQgNUe10ixXZmuO2v9enOJReoQ/viewform?entry.1972292648=developers.vtex.com%26entry.1799503232=)

[GuidesLearn how to use our APIs and extend the VTEX platform.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-using-the-assets-builder/docs/guides)

[API ReferenceExplore detailed information about our endpoints.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-using-the-assets-builder/docs/api-reference)

[App DevelopmentLearn how to build cloud-based apps and integrations.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-using-the-assets-builder/docs/app-development)

[Storefront DevelopmentExpress your brand identity creating unique storefronts.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-using-the-assets-builder/docs/storefront-development)

[VTEX IO AppsFind pre-built solutions to grow your business.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-using-the-assets-builder/docs/vtex-io-apps)

[TroubleshootingFind practical solutions to common development issues.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-using-the-assets-builder/docs/troubleshooting)

[Release NotesStay up to date with our latest releases and bug fixes.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-using-the-assets-builder/updates/release-notes)

Storefront Development

[Getting started with storefront solutions](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-using-the-assets-builder/docs/guides/getting-started-with-storefront-solutions)

---

[FastStore](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-using-the-assets-builder/docs/guides/faststore)

---

[Store Framework](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-using-the-assets-builder/docs/guides/store-framework)

[Store Theme](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-using-the-assets-builder/docs/guides/vtex-io-documentation-store-theme)

[Getting started](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-using-the-assets-builder/docs/guides/getting-started-3)

Concepts

[Building pages](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-using-the-assets-builder/docs/guides/store-framework-building-pages)

[Using components](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-using-the-assets-builder/docs/guides/store-framework-using-components)

[Building a horizontal Product Summary](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-using-the-assets-builder/docs/guides/vtex-io-documentation-building-a-horizontal-product-summary)

[Building a Shelf](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-using-the-assets-builder/docs/guides/vtex-io-documentation-building-a-shelf)

[Configuring custom images for the SKU Selector](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-using-the-assets-builder/docs/guides/vtex-io-documentation-configuring-custom-images-for-the-sku-selector)

[Creating a native form for your store users](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-using-the-assets-builder/docs/guides/vtex-io-documentation-creating-a-native-form-for-your-store-users)

[Creating a product availability form](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-using-the-assets-builder/docs/guides/vtex-io-documentation-creating-a-product-availability-form)

[Overriding native app blocks](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-using-the-assets-builder/docs/guides/vtex-io-documentation-overriding-native-app-blocks)

[Using Sandbox blocks](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-using-the-assets-builder/docs/guides/vtex-io-documentation-using-sandbox-blocks)

[Using the Assets Builder](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-using-the-assets-builder/docs/guides/vtex-io-documentation-using-the-assets-builder)

[Setting up Delivery Promise components (Beta)](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-using-the-assets-builder/docs/guides/setting-up-delivery-promise-components)

[Using advanced layouts](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-using-the-assets-builder/docs/guides/store-framework-using-advanced-layouts)

[Working with Site Editor](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-using-the-assets-builder/docs/guides/store-framework-working-with-site-editor)

[Styling](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-using-the-assets-builder/docs/guides/store-framework-styling)

[Dealing with events](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-using-the-assets-builder/docs/guides/store-framework-dealing-with-events)

[Configuring Analytics (Google Tag Manager)](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-using-the-assets-builder/docs/guides/store-framework-configuring-analytics-google-tag-manager)

[Setting up cross-border stores](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-using-the-assets-builder/docs/guides/store-framework-setting-up-cross-border-stores)

[Handling internationalization](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-using-the-assets-builder/docs/guides/vtex-io-multi-language-stores)

[Routing](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-using-the-assets-builder/docs/guides/store-framework-routing)

[Managing performance](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-using-the-assets-builder/docs/guides/store-framework-managing-performance)

[Improving store accessibility with semantic HTML migration](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-using-the-assets-builder/docs/guides/vtex-io-documentation-semantic-html-migration)

[Going live](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-using-the-assets-builder/docs/guides/vtex-io-documentation-go-live)

[Updating live stores](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-using-the-assets-builder/docs/guides/store-framework-updating-live-stores)

---

(Legacy) CMS Portal

---

[Storefront best practices](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-using-the-assets-builder/docs/guides/storefront-best-practices)

---

[Guides](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-using-the-assets-builder/docs/guides)

[API Reference](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-using-the-assets-builder/docs/api-reference)

[App Development](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-using-the-assets-builder/docs/app-development)

[Storefront Development](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-using-the-assets-builder/docs/storefront-development)

[VTEX IO Apps](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-using-the-assets-builder/docs/vtex-io-apps)

[Troubleshooting](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-using-the-assets-builder/docs/troubleshooting)

---

[Release Notes](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-using-the-assets-builder/updates/release-notes)

Storefront Development

[Getting started with storefront solutions](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-using-the-assets-builder/docs/guides/getting-started-with-storefront-solutions)

---

[FastStore](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-using-the-assets-builder/docs/guides/faststore)

---

[Store Framework](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-using-the-assets-builder/docs/guides/store-framework)

[Store Theme](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-using-the-assets-builder/docs/guides/vtex-io-documentation-store-theme)

[Getting started](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-using-the-assets-builder/docs/guides/getting-started-3)

Concepts

[Building pages](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-using-the-assets-builder/docs/guides/store-framework-building-pages)

[Using components](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-using-the-assets-builder/docs/guides/store-framework-using-components)

[Building a horizontal Product Summary](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-using-the-assets-builder/docs/guides/vtex-io-documentation-building-a-horizontal-product-summary)

[Building a Shelf](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-using-the-assets-builder/docs/guides/vtex-io-documentation-building-a-shelf)

[Configuring custom images for the SKU Selector](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-using-the-assets-builder/docs/guides/vtex-io-documentation-configuring-custom-images-for-the-sku-selector)

[Creating a native form for your store users](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-using-the-assets-builder/docs/guides/vtex-io-documentation-creating-a-native-form-for-your-store-users)

[Creating a product availability form](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-using-the-assets-builder/docs/guides/vtex-io-documentation-creating-a-product-availability-form)

[Overriding native app blocks](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-using-the-assets-builder/docs/guides/vtex-io-documentation-overriding-native-app-blocks)

[Using Sandbox blocks](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-using-the-assets-builder/docs/guides/vtex-io-documentation-using-sandbox-blocks)

[Using the Assets Builder](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-using-the-assets-builder/docs/guides/vtex-io-documentation-using-the-assets-builder)

[Setting up Delivery Promise components (Beta)](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-using-the-assets-builder/docs/guides/setting-up-delivery-promise-components)

[Using advanced layouts](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-using-the-assets-builder/docs/guides/store-framework-using-advanced-layouts)

[Working with Site Editor](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-using-the-assets-builder/docs/guides/store-framework-working-with-site-editor)

[Styling](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-using-the-assets-builder/docs/guides/store-framework-styling)

[Dealing with events](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-using-the-assets-builder/docs/guides/store-framework-dealing-with-events)

[Configuring Analytics (Google Tag Manager)](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-using-the-assets-builder/docs/guides/store-framework-configuring-analytics-google-tag-manager)

[Setting up cross-border stores](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-using-the-assets-builder/docs/guides/store-framework-setting-up-cross-border-stores)

[Handling internationalization](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-using-the-assets-builder/docs/guides/vtex-io-multi-language-stores)

[Routing](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-using-the-assets-builder/docs/guides/store-framework-routing)

[Managing performance](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-using-the-assets-builder/docs/guides/store-framework-managing-performance)

[Improving store accessibility with semantic HTML migration](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-using-the-assets-builder/docs/guides/vtex-io-documentation-semantic-html-migration)

[Going live](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-using-the-assets-builder/docs/guides/vtex-io-documentation-go-live)

[Updating live stores](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-using-the-assets-builder/docs/guides/store-framework-updating-live-stores)

---

(Legacy) CMS Portal

---

[Storefront best practices](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-using-the-assets-builder/docs/guides/storefront-best-practices)

---

[Storefront Development](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-using-the-assets-builder/docs/storefront-development)

[Store Framework](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-using-the-assets-builder/docs/guides/store-framework)

[Using components](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-using-the-assets-builder/docs/guides/store-framework-using-components)

[Using the Assets Builder](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-using-the-assets-builder/docs/guides/vtex-io-documentation-using-the-assets-builder)

Using the Assets Builder

Learn how to use the Assets Builder to manage and reference images and other assets within your VTEX IO Store Theme.

This guide explains how to use the [Assets Builder](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-assets-builder) to handle assets, such as images, within your Store Theme. By following these steps, you can simplify asset management by letting the builder automatically handle file paths and uploads to the VTEX File Manager, making your theme's code lighter and more efficient.

Before you begin, keep the following points in mind:

* **Caching:** The Assets Builder is not responsible for URL caching; the File Manager handles this.
* **Scope:** You can only reference assets from your theme's `blocks` and CSS. It is not possible to reference them from React components or other apps.
* **File optimization:** Avoid long file names or unnecessarily large assets, as this can negatively affect request payload size and builder performance.
* **Supported formats:** You can use any image extension, such as `.jpeg`, `.png`, and `.gif`. Video files are not supported.

## Instructions

### Step 1 - Add the Assets Builder

1. Open your theme's `manifest.json` file.
2. Add the `assets` builder to the `builders` list:
`1
"builders": {
2
 "assets": "0.x"
3
},
`

### Step 2 - Create the assets folder

In the `store` root directory of your theme, create a new folder named `assets`. This folder will store all your theme's assets.

### Step 3 - Add asset files

Add your asset files to the `assets` folder. You can create subfolders within `assets` to better organize your files.

![{"base64":"  ","img":{"width":351,"height":361,"type":"png","mime":"image/png","wUnits":"px","hUnits":"px","length":16859,"url":"https://cdn.jsdelivr.net/gh/vtexdocs/dev-portal-content@main/images/vtex-io-documentation-using-the-assets-builder-0.png"}}](https://read.calvincode.net/reader?url=https://cdn.jsdelivr.net/gh/vtexdocs/dev-portal-content@main/images/vtex-io-documentation-using-the-assets-builder-0.png)

> If you use subfolders, remember to include the full path when referencing the asset, such as `assets/events/vtex-day.jpg`.

### Step 4 - Reference the assets

Use the asset path (e.g., `assets/{fileName}.{extension}`) as the value for a block's prop, such as `src`, or a CSS class to render your media.

`1

"image": {

2

 "props": {

3

 "src": "assets/myimage.png"

4

 }

5

}

`

Once you save the changes, the Assets Builder automatically uploads the file to the VTEX File Manager and generates an immutable URL, which the platform will use when rendering the theme.

Contributors

1

[![Photo of the contributor](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-using-the-assets-builder/_next/image?url=https%3A%2F%2Favatars.githubusercontent.com%2Fu%2F60782333%3Fv%3D4%26w=64%26q=75)](https://github.com/carolinamenezes)

Was this helpful?

Yes

No

[Suggest Edits (GitHub)](https://read.calvincode.net/reader?url=https://github.com/vtexdocs/dev-portal-content/edit/main/docs/guides/vtex-io/Storefront-Guides/concepts-1/vtex-io-documentation-using-the-assets-builder.md)

[Using Sandbox blocks« Previous](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-using-the-assets-builder//docs/guides/vtex-io-documentation-using-sandbox-blocks)[Setting up Delivery Promise components (Beta)Next »](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-using-the-assets-builder//docs/guides/setting-up-delivery-promise-components)

Contributors

1

[![Photo of the contributor](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-using-the-assets-builder/_next/image?url=https%3A%2F%2Favatars.githubusercontent.com%2Fu%2F60782333%3Fv%3D4%26w=64%26q=75)](https://github.com/carolinamenezes)

ON THIS PAGE

[Instructions](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-using-the-assets-builder/docs/guides/vtex-io-documentation-using-the-assets-builder%23instructions)

[Step 1 - Add the Assets Builder](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-using-the-assets-builder/docs/guides/vtex-io-documentation-using-the-assets-builder%23step-1-add-the-assets-builder)[Step 2 - Create the assets folder](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-using-the-assets-builder/docs/guides/vtex-io-documentation-using-the-assets-builder%23step-2-create-the-assets-folder)[Step 3 - Add asset files](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-using-the-assets-builder/docs/guides/vtex-io-documentation-using-the-assets-builder%23step-3-add-asset-files)[Step 4 - Reference the assets](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-using-the-assets-builder/docs/guides/vtex-io-documentation-using-the-assets-builder%23step-4-reference-the-assets)

Was this helpful?

 Send feedback

[Suggest edits (GitHub)](https://read.calvincode.net/reader?url=https://github.com/vtexdocs/dev-portal-content/edit/main/docs/guides/vtex-io/Storefront-Guides/concepts-1/vtex-io-documentation-using-the-assets-builder.md)

Copy page

On this page

ON THIS PAGE

[Instructions](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-using-the-assets-builder/docs/guides/vtex-io-documentation-using-the-assets-builder%23instructions)

[Step 1 - Add the Assets Builder](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-using-the-assets-builder/docs/guides/vtex-io-documentation-using-the-assets-builder%23step-1-add-the-assets-builder)[Step 2 - Create the assets folder](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-using-the-assets-builder/docs/guides/vtex-io-documentation-using-the-assets-builder%23step-2-create-the-assets-folder)[Step 3 - Add asset files](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-using-the-assets-builder/docs/guides/vtex-io-documentation-using-the-assets-builder%23step-3-add-asset-files)[Step 4 - Reference the assets](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-using-the-assets-builder/docs/guides/vtex-io-documentation-using-the-assets-builder%23step-4-reference-the-assets)

On this page

[Github](https://read.calvincode.net/reader?url=https://github.com/vtex-apps)[Help Center](https://read.calvincode.net/reader?url=https://help.vtex.com/)[Community](https://read.calvincode.net/reader?url=https://community.vtex.com/?%5Fga=2.198523433.743584735.1647618303-1974737580.1645714642)[Feedback](https://read.calvincode.net/reader?url=https://docs.google.com/forms/d/e/1FAIpQLSfmnotPvPjw-SjiE7lt2Nt3RQgNUe10ixXZmuO2v9enOJReoQ/viewform?entry.1972292648=developers.vtex.com%26entry.1799503232=)


[System] You are a VTEX documentation expert. You provide accurate, detailed information about VTEX platform, APIs, apps, and Store Framework development.

[User] Provide a guide on guides vtex store components in VTEX.

[Assistant]
Documentation

[Feedback](https://read.calvincode.net/reader?url=https://docs.google.com/forms/d/e/1FAIpQLSfmnotPvPjw-SjiE7lt2Nt3RQgNUe10ixXZmuO2v9enOJReoQ/viewform?entry.1972292648=developers.vtex.com%26entry.1799503232=)

[GuidesLearn how to use our APIs and extend the VTEX platform.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-store-components/docs/guides)

[API ReferenceExplore detailed information about our endpoints.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-store-components/docs/api-reference)

[App DevelopmentLearn how to build cloud-based apps and integrations.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-store-components/docs/app-development)

[Storefront DevelopmentExpress your brand identity creating unique storefronts.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-store-components/docs/storefront-development)

[VTEX IO AppsFind pre-built solutions to grow your business.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-store-components/docs/vtex-io-apps)

[TroubleshootingFind practical solutions to common development issues.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-store-components/docs/troubleshooting)

[Release NotesStay up to date with our latest releases and bug fixes.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-store-components/updates/release-notes)

[Guides](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-store-components/docs/guides)

[API Reference](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-store-components/docs/api-reference)

[App Development](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-store-components/docs/app-development)

[Storefront Development](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-store-components/docs/storefront-development)

[VTEX IO Apps](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-store-components/docs/vtex-io-apps)

[Troubleshooting](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-store-components/docs/troubleshooting)

---

[Release Notes](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-store-components/updates/release-notes)

VTEX Store Components

VTEX Store Components is a collection of components that can be used to create/extend others VTEX apps.

* [VTEX Store Components](#vtex-store-components)
   * [Usage](#usage)
   * [Styles API](#styles-api)
   * [Components](#components)
   * [Creating a new component](#creating-a-new-component)
         * [Project structure](#project-structure)
   * [Troubleshooting](#troubleshooting)
   * [Contributing](#contributing)
   * [Tests](#tests)
         * [Travis CI](#travis-ci)
   * [Contributors](#contributors)

## Usage

The Store Components collection uses the `store` builder with the blocks architecture. Please refer to our [Builder](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-builders) documentation to learn more about the `store` builder.

To use this app, you must import it as dependency of your project in the `manifest.json` file.

`1

 "dependencies": {

2

 "vtex.store-components": "3.x"

3

 }

`

Then, you can start adding components to your store theme app.

## Styles API

The Store Components collection provides some CSS classes as an API for style customization.

To use this CSS API, you must add the `styles` builder and create an app styling CSS file.

1. Add the `styles` builder to your `manifest.json`:

`1

 "builders": {

2

 "styles": "2.x"

3

 }

`

1. Create a file called `vtex.store-components.css` inside the `styles/css` folder. Add your custom styles:

`1

.container {

2

 margin-top: 10px;

3

}

`

## Components

For more information, check the documentation of all components of the Store Components collection.

* [Availability Subscriber](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-store-components-availabilitysubscriber)
* [Back To Top Button](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-store-components-backtotopbutton)
* [Buy Button](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-store-components-buybutton)
* [Image](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-store-components-image)
* [InfoCard](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-store-components-infocard)
* [Logo](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-store-components-logo)
* [Newsletter](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-store-components-newsletter)
* [Product Brand](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-store-components-productbrand)
* [Product Description](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-store-components-productdescription)
* [Product Images](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-store-components-productimages)
* [Product Name](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-store-components-productname)
* [Product SKU Attributes](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-store-components-productskuattributes)
* [Product Price](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-store-components-productprice)
* [Product Specifications](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-store-components-productspecifications)
* [SKU Selector](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-store-components-skuselector)
* [Search Bar](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-store-components-searchbar)
* [Share](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-store-components-share)
* [Shipping Simulator](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-store-components-shippingsimulator)
* [Notification](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-store-components-notification)

> **The following blocks have been deprecated:** `Animation`, `Categories Highlights`, `Collection Badges`, `Container`, `Discount Badge`, `Gradient Collapse`, `Greeting`, `Slider`. Despite this, support for them is still granted.

## Creating a new component

To start your development, create a new folder on react/components. That's where your source code will be stored. Also create a new js file on /react, this file should be used to expose your component, like:

### Project structure

Inside your `react/components/<component_name>` you should have:

* index.js
* README.md
* \[Optional\] components/
* \[Optional\] constants/
* \[Optional\] utils/
* \[Optional\] queries/
* \[Optional\] mutations/
* \[Optional\] styles.css

Next, inside of `react/` folder you need to export your component, such as:

`1

import ProductPrice from './components/ProductPrice/index'

2

3

export default ProductPrice

`

Also, all dependencies needed should be inserted inside the react/package.json.

## Troubleshooting

You can check if others are passing through similar issues [here](https://read.calvincode.net/reader?url=https://github.com/vtex-apps/store-components/issues). Also feel free to [open issues](https://read.calvincode.net/reader?url=https://github.com/vtex-apps/store-components/issues/new) or contribute with pull requests.

## Tests

To execute our tests go to `react/` folder and run `yarn test`

Contributors

1

[![Photo of the contributor](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-store-components/_next/image?url=https%3A%2F%2Favatars.githubusercontent.com%2Fu%2F60782333%3Fv%3D4%26w=64%26q=75)](https://github.com/carolinamenezes)

Was this helpful?

Yes

No

[Suggest Edits (GitHub)](https://read.calvincode.net/reader?url=https://github.com/vtexdocs/dev-portal-content/edit/main/docs/guides/vtex-io/Store-Framework-Apps/vtex-store-components.md)

Contributors

1

[![Photo of the contributor](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-store-components/_next/image?url=https%3A%2F%2Favatars.githubusercontent.com%2Fu%2F60782333%3Fv%3D4%26w=64%26q=75)](https://github.com/carolinamenezes)

ON THIS PAGE

[Usage](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-store-components/docs/guides/vtex-store-components%23usage)

[Styles API](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-store-components/docs/guides/vtex-store-components%23styles-api)

[Components](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-store-components/docs/guides/vtex-store-components%23components)

[Creating a new component](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-store-components/docs/guides/vtex-store-components%23creating-a-new-component)

[Project structure](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-store-components/docs/guides/vtex-store-components%23project-structure)

[Troubleshooting](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-store-components/docs/guides/vtex-store-components%23troubleshooting)

[Tests](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-store-components/docs/guides/vtex-store-components%23tests)

Was this helpful?

 Send feedback

[Suggest edits (GitHub)](https://read.calvincode.net/reader?url=https://github.com/vtexdocs/dev-portal-content/edit/main/docs/guides/vtex-io/Store-Framework-Apps/vtex-store-components.md)

Copy page

On this page

ON THIS PAGE

[Usage](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-store-components/docs/guides/vtex-store-components%23usage)

[Styles API](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-store-components/docs/guides/vtex-store-components%23styles-api)

[Components](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-store-components/docs/guides/vtex-store-components%23components)

[Creating a new component](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-store-components/docs/guides/vtex-store-components%23creating-a-new-component)

[Project structure](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-store-components/docs/guides/vtex-store-components%23project-structure)

[Troubleshooting](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-store-components/docs/guides/vtex-store-components%23troubleshooting)

[Tests](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-store-components/docs/guides/vtex-store-components%23tests)

On this page

[Github](https://read.calvincode.net/reader?url=https://github.com/vtex-apps)[Help Center](https://read.calvincode.net/reader?url=https://help.vtex.com/)[Community](https://read.calvincode.net/reader?url=https://community.vtex.com/?%5Fga=2.198523433.743584735.1647618303-1974737580.1645714642)[Feedback](https://read.calvincode.net/reader?url=https://docs.google.com/forms/d/e/1FAIpQLSfmnotPvPjw-SjiE7lt2Nt3RQgNUe10ixXZmuO2v9enOJReoQ/viewform?entry.1972292648=developers.vtex.com%26entry.1799503232=)


[System] You are a VTEX documentation expert. You provide accurate, detailed information about VTEX platform, APIs, apps, and Store Framework development.

[User] Provide a guide on guides tax services recipe in VTEX.

[Assistant]
Documentation

[Feedback](https://read.calvincode.net/reader?url=https://docs.google.com/forms/d/e/1FAIpQLSfmnotPvPjw-SjiE7lt2Nt3RQgNUe10ixXZmuO2v9enOJReoQ/viewform?entry.1972292648=developers.vtex.com%26entry.1799503232=)

[GuidesLearn how to use our APIs and extend the VTEX platform.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/tax-services-recipe/docs/guides)

[API ReferenceExplore detailed information about our endpoints.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/tax-services-recipe/docs/api-reference)

[App DevelopmentLearn how to build cloud-based apps and integrations.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/tax-services-recipe/docs/app-development)

[Storefront DevelopmentExpress your brand identity creating unique storefronts.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/tax-services-recipe/docs/storefront-development)

[VTEX IO AppsFind pre-built solutions to grow your business.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/tax-services-recipe/docs/vtex-io-apps)

[TroubleshootingFind practical solutions to common development issues.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/tax-services-recipe/docs/troubleshooting)

[Release NotesStay up to date with our latest releases and bug fixes.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/tax-services-recipe/updates/release-notes)

Guides

[VTEX Platform Overview](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/tax-services-recipe/docs/guides/vtex-platform-overview)

---

[API usage](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/tax-services-recipe/docs/guides/api-usage)

---

[Getting started](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/tax-services-recipe/docs/guides/getting-started)

---

Integration Guides

[Back office integration guide (ERP/PIM/WMS)](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/tax-services-recipe/docs/guides/erp-integration-guide)

[Customer Credit](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/tax-services-recipe/docs/guides/customer-credit-integration-guide)

[External Marketplace](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/tax-services-recipe/docs/guides/external-marketplace-integration-guide)

[External Seller](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/tax-services-recipe/docs/guides/external-seller-integration-guide)

[Gift Card](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/tax-services-recipe/docs/guides/gift-card-integration-guide)

[Headless commerce](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/tax-services-recipe/docs/guides/headless-commerce)

[Login (SSO)](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/tax-services-recipe/docs/guides/login-integration-guide)

[Punchout](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/tax-services-recipe/docs/guides/punchout)

[Offer Management Integration Guide](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/tax-services-recipe/docs/guides/sent-offers-integration-guide-connectors)

[Payments](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/tax-services-recipe/docs/guides/payments-integration-guide)

[Search Protocol](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/tax-services-recipe/docs/guides/search-integration-guide)

[Session Manager](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/tax-services-recipe/docs/guides/session-manager)

[Tax Service](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/tax-services-recipe/docs/guides/tax-service-integration-guide)

[Overview](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/tax-services-recipe/docs/guides/tax-services-overview)

[Specification](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/tax-services-recipe/docs/guides/tax-services-specification)

[Recipe](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/tax-services-recipe/docs/guides/tax-services-recipe)

[Tax Protocol GraphQL API](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/tax-services-recipe/docs/guides/tax-protocol-graphql-api)

[Reference Implementations](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/tax-services-recipe/docs/guides/tax-services-reference-implementation)

[Pricing Hub](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/tax-services-recipe/docs/guides/pricing-hub)

[reCAPTCHA](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/tax-services-recipe/docs/guides/recaptcha)

---

[Catalog](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/tax-services-recipe/docs/guides/catalog-integration)

---

[Checkout](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/tax-services-recipe/docs/guides/checkout-api-overview)

---

[Master Data](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/tax-services-recipe/docs/guides/master-data)

---

Payments

---

Orders

---

Logistics

---

B2B Suite

---

VTEX Sales App

---

UI Customization

---

Message Center

---

Pricing

---

Promotions

---

Infrastructure

---

Search

---

Storefront Permissions

---

[VTEX Activity Flow](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/tax-services-recipe/docs/guides/activity-flow)

---

[VTEX Ads](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/tax-services-recipe/docs/guides/vtex-ads)

---

VTEX Session

---

VTEX Shield

---

[Data Protection Plus](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/tax-services-recipe/docs/guides/data-protection-plus)

---

Weni by VTEX

---

[Guides](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/tax-services-recipe/docs/guides)

[API Reference](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/tax-services-recipe/docs/api-reference)

[App Development](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/tax-services-recipe/docs/app-development)

[Storefront Development](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/tax-services-recipe/docs/storefront-development)

[VTEX IO Apps](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/tax-services-recipe/docs/vtex-io-apps)

[Troubleshooting](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/tax-services-recipe/docs/troubleshooting)

---

[Release Notes](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/tax-services-recipe/updates/release-notes)

Guides

[VTEX Platform Overview](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/tax-services-recipe/docs/guides/vtex-platform-overview)

---

[API usage](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/tax-services-recipe/docs/guides/api-usage)

---

[Getting started](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/tax-services-recipe/docs/guides/getting-started)

---

Integration Guides

[Back office integration guide (ERP/PIM/WMS)](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/tax-services-recipe/docs/guides/erp-integration-guide)

[Customer Credit](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/tax-services-recipe/docs/guides/customer-credit-integration-guide)

[External Marketplace](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/tax-services-recipe/docs/guides/external-marketplace-integration-guide)

[External Seller](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/tax-services-recipe/docs/guides/external-seller-integration-guide)

[Gift Card](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/tax-services-recipe/docs/guides/gift-card-integration-guide)

[Headless commerce](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/tax-services-recipe/docs/guides/headless-commerce)

[Login (SSO)](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/tax-services-recipe/docs/guides/login-integration-guide)

[Punchout](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/tax-services-recipe/docs/guides/punchout)

[Offer Management Integration Guide](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/tax-services-recipe/docs/guides/sent-offers-integration-guide-connectors)

[Payments](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/tax-services-recipe/docs/guides/payments-integration-guide)

[Search Protocol](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/tax-services-recipe/docs/guides/search-integration-guide)

[Session Manager](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/tax-services-recipe/docs/guides/session-manager)

[Tax Service](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/tax-services-recipe/docs/guides/tax-service-integration-guide)

[Overview](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/tax-services-recipe/docs/guides/tax-services-overview)

[Specification](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/tax-services-recipe/docs/guides/tax-services-specification)

[Recipe](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/tax-services-recipe/docs/guides/tax-services-recipe)

[Tax Protocol GraphQL API](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/tax-services-recipe/docs/guides/tax-protocol-graphql-api)

[Reference Implementations](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/tax-services-recipe/docs/guides/tax-services-reference-implementation)

[Pricing Hub](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/tax-services-recipe/docs/guides/pricing-hub)

[reCAPTCHA](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/tax-services-recipe/docs/guides/recaptcha)

---

[Catalog](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/tax-services-recipe/docs/guides/catalog-integration)

---

[Checkout](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/tax-services-recipe/docs/guides/checkout-api-overview)

---

[Master Data](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/tax-services-recipe/docs/guides/master-data)

---

Payments

---

Orders

---

Logistics

---

B2B Suite

---

VTEX Sales App

---

UI Customization

---

Message Center

---

Pricing

---

Promotions

---

Infrastructure

---

Search

---

Storefront Permissions

---

[VTEX Activity Flow](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/tax-services-recipe/docs/guides/activity-flow)

---

[VTEX Ads](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/tax-services-recipe/docs/guides/vtex-ads)

---

VTEX Session

---

VTEX Shield

---

[Data Protection Plus](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/tax-services-recipe/docs/guides/data-protection-plus)

---

Weni by VTEX

---

[Guides](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/tax-services-recipe/docs/guides)

Integration Guides

[Tax Service](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/tax-services-recipe/docs/guides/tax-service-integration-guide)

[Recipe](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/tax-services-recipe/docs/guides/tax-services-recipe)

Recipe

## Clients

Clients are an abstraction for implementing connections to VTEX APIs or external ones that are agnostic to the purpose of the application you are developing. So, the methods of a client class expect some parameters that are necessary for some calls to the API, such as a body to a `POST` request.

### Developing clients on a tax service

Regarding the purpose of a tax service integration, there are some connections to be implemented to establish the [tax calculation flow](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/tax-services-overview):

* To the [Checkout API](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/api-reference/checkout-api), to do the `orderForm` configuration.
* To the external tax provider API, to calculate any taxes related to the items of a cart.

### Example of implementation

This [tax protocol example](https://read.calvincode.net/reader?url=https://github.com/vtex-apps/tax-protocol-example) is one way you can implement your clients. More details below:

* `Checkout`: used to configure the tax service in the Checkout;
* `Logistics`: it has a single method that can be used to fetch information about docks, using its id;
* `TaxProvider`: used to connect with the provider's external API;
* `VtexCommerce`: a basic external client that can be used as the class that can be inherited to develop other clients that connect to VTEX API.

## Routes

Routes are the endpoints that will be defined on the `service.json` file and need to have handlers to deal with the requests that are coming through those routes.

### Necessary routes

When implementing a tax integration app, there are three types of operations that the application needs to handle defining routes and using handlers:

* Configure the tax integration by changing the order form configuration - activate or deactivate.

> Private route that configures the tax service for a specific account.

* Simulate the taxes to be applied to a cart and return this information to the Checkout in a specific format.

> This route will be the one that is going to be registered on the Order Form Configuration.

* Commit the order taxes based on a logic regarding the order status changing

> It's the same route that is on the `hooks` object on the provider's response to the Checkout API after calculating the taxes.

It is important to emphasize that, for the last two routes to work, you must have the tax service configured in your account. This can be done by using the first endpoint described above. Basically, in this step, one is going to:

1. Define the routes in the `service.json` file;
2. Create handlers for those routes;
3. Use the handlers on the `node/index.ts` file.

## Parsers

As a way to simplify the logic behind the handlers that need to exist when developing integration with a tax service, the entire code logic needed to parse the payloads to a specific format can be implemented as a parser. This can be necessary because both the external provider API and Checkout API expect specific payload formats.

There are a lot of ways of doing it, but this documentation focuses on how it was made in the Tax Protocol Example that you can find on Github.

### Parsing data from VTEX to provider

The external provider API will receive a POST request with a specifically formatted body from Checkout. In case the provider expects a different format, one can implement the logic inside a function that parses the information.

### Parsing data from provider to VTEX

Considering the request done by the provider to the VTEX Checkout API, it is also possible to implement a parser in order to put the payload in the format that the checkout expects.

Contributors

2

[![Photo of the contributor](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/tax-services-recipe/_next/image?url=https%3A%2F%2Favatars.githubusercontent.com%2Fu%2F25390429%3Fv%3D4%26w=64%26q=75)](https://github.com/karenkrieger)

[![Photo of the contributor](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/tax-services-recipe/_next/image?url=https%3A%2F%2Favatars.githubusercontent.com%2Fu%2F7108339%3Fv%3D4%26w=64%26q=75)](https://github.com/brunoamui)

Was this helpful?

Yes

No

[Suggest Edits (GitHub)](https://read.calvincode.net/reader?url=https://github.com/vtexdocs/dev-portal-content/edit/main/docs/guides/Integration-Guides/tax-service-integration-guide/tax-services-recipe.md)

[Specification« Previous](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/tax-services-recipe//docs/guides/tax-services-specification)[Tax Protocol GraphQL APINext »](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/tax-services-recipe//docs/guides/tax-protocol-graphql-api)

Contributors

2

[![Photo of the contributor](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/tax-services-recipe/_next/image?url=https%3A%2F%2Favatars.githubusercontent.com%2Fu%2F25390429%3Fv%3D4%26w=64%26q=75)](https://github.com/karenkrieger)

[![Photo of the contributor](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/tax-services-recipe/_next/image?url=https%3A%2F%2Favatars.githubusercontent.com%2Fu%2F7108339%3Fv%3D4%26w=64%26q=75)](https://github.com/brunoamui)

ON THIS PAGE

[Clients](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/tax-services-recipe/docs/guides/tax-services-recipe%23clients)

[Developing clients on a tax service](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/tax-services-recipe/docs/guides/tax-services-recipe%23developing-clients-on-a-tax-service)[Example of implementation](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/tax-services-recipe/docs/guides/tax-services-recipe%23example-of-implementation)

[Routes](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/tax-services-recipe/docs/guides/tax-services-recipe%23routes)

[Necessary routes](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/tax-services-recipe/docs/guides/tax-services-recipe%23necessary-routes)

[Parsers](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/tax-services-recipe/docs/guides/tax-services-recipe%23parsers)

[Parsing data from VTEX to provider](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/tax-services-recipe/docs/guides/tax-services-recipe%23parsing-data-from-vtex-to-provider)[Parsing data from provider to VTEX](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/tax-services-recipe/docs/guides/tax-services-recipe%23parsing-data-from-provider-to-vtex)

Was this helpful?

 Send feedback

[Suggest edits (GitHub)](https://read.calvincode.net/reader?url=https://github.com/vtexdocs/dev-portal-content/edit/main/docs/guides/Integration-Guides/tax-service-integration-guide/tax-services-recipe.md)

Copy page

On this page

ON THIS PAGE

[Clients](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/tax-services-recipe/docs/guides/tax-services-recipe%23clients)

[Developing clients on a tax service](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/tax-services-recipe/docs/guides/tax-services-recipe%23developing-clients-on-a-tax-service)[Example of implementation](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/tax-services-recipe/docs/guides/tax-services-recipe%23example-of-implementation)

[Routes](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/tax-services-recipe/docs/guides/tax-services-recipe%23routes)

[Necessary routes](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/tax-services-recipe/docs/guides/tax-services-recipe%23necessary-routes)

[Parsers](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/tax-services-recipe/docs/guides/tax-services-recipe%23parsers)

[Parsing data from VTEX to provider](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/tax-services-recipe/docs/guides/tax-services-recipe%23parsing-data-from-vtex-to-provider)[Parsing data from provider to VTEX](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/tax-services-recipe/docs/guides/tax-services-recipe%23parsing-data-from-provider-to-vtex)

On this page

[Github](https://read.calvincode.net/reader?url=https://github.com/vtex-apps)[Help Center](https://read.calvincode.net/reader?url=https://help.vtex.com/)[Community](https://read.calvincode.net/reader?url=https://community.vtex.com/?%5Fga=2.198523433.743584735.1647618303-1974737580.1645714642)[Feedback](https://read.calvincode.net/reader?url=https://docs.google.com/forms/d/e/1FAIpQLSfmnotPvPjw-SjiE7lt2Nt3RQgNUe10ixXZmuO2v9enOJReoQ/viewform?entry.1972292648=developers.vtex.com%26entry.1799503232=)