---
title: Upgrading to 2025-10
description: This guide describes how to upgrade your customer account UI extension to API version `2025-10` and adopt [Polaris](/beta/next-gen-dev-platform/polaris) web components.
api_version: 2025-10
api_name: customer-account-ui-extensions
source_url:
html: https://shopify.dev/docs/api/customer-account-ui-extensions/latest/upgrading-to-2025-10
md: https://shopify.dev/docs/api/customer-account-ui-extensions/latest/upgrading-to-2025-10.md
---
# Upgrading to 2025-10
This guide describes how to upgrade your customer account UI extension to API version `2025-10` and adopt [Polaris](https://shopify.dev/beta/next-gen-dev-platform/polaris) web components.
***
## Update API version
Set the API version to `2025-10` in `shopify.extension.toml` to use Polaris web components.
### Examples
* #### shopify.extension.toml
##### shopify.extension.toml
```toml
api_version = "2025-10"
[[extensions]]
name = "your-extension"
handle = "your-extension"
type = "ui_extension"
# Contents of your existing file...
```
## Adjust package dependencies
As of `2025-10`, Shopify recommends Preact for UI extensions. Update the dependencies in your `package.json` file and re-install.
New dependencies with Preact
Previous dependencies with React
Previous dependencies with JavaScript
### Examples
* #### New dependencies with Preact
##### package.json
```json
{
"dependencies": {
"preact": "^10.10.x",
"@preact/signals": "^2.3.x",
"@shopify/ui-extensions": "2025.10.x"
}
}
```
## TypeScript Configuration
Get full IntelliSense and auto-complete support by adding a config file for your extension at `extensions/{extension-name}/tsconfig.json`. You do **not** need to change your app's root `tsconfig.json` file.
New tsconfig.json
Old tsconfig.json
### Examples
* #### New tsconfig.json
##### tsconfig.json
```json
{
"compilerOptions": {
"jsx": "react-jsx",
"jsxImportSource": "preact",
"target": "ES2020",
"checkJs": true,
"allowJs": true,
"moduleResolution": "node",
"esModuleInterop": true
}
}
```
## Upgrade the Shopifiy CLI
The new CLI adds supoort for building 2025-10 extensions.
The `shopify app dev` command runs your app and also generates a `shopify.d.ts` file in your extension directory, adding support for the new global `shopify` object.
### Examples
* #### Support new global shopify object
##### CLI
```bash
# Upgrade to latest version of the CLI
npm install -g @shopify/cli
# Run the app to generate the type definition file
shopify app dev
```
## Optional ESLint configuration
If your app is using ESLint, update your configuration to include the new global `shopify` object.
### Examples
* #### .eslintrc.cjs
##### Default
```js
module.exports = {
globals: {
shopify: 'readonly',
},
};
```
## Migrate API calls
Instead of accessing APIs from a callback parameter or React hook, access them from the global `shopify` object. Here's an example of migrating the Cart Line Target API call.
New API calls in Preact
Previous API calls in React
Previous API calls in JavaScript
### Examples
* #### New API calls in Preact
##### Preact
```tsx
import '@shopify/ui-extensions/preact';
import {render} from 'preact';
export default function extension() {
render(, document.body);
}
function Extension() {
return (
Line item title: {shopify.target.value.merchandise.title}
);
}
```
## Migrate to Polaris web components
Polaris web components are exposed as custom HTML elements. Update your React or JavaScript components to custom elements.
New components in Preact
Previous components in React
Previous components in JavaScript
### Examples
* #### New components in Preact
##### Preact
```tsx
import '@shopify/ui-extensions/preact';
import {render} from 'preact';
export default function extension() {
render(, document.body);
}
function Extension() {
return (
Save
);
}
```
## Mapping Legacy components to Polaris web
| **Legacy Component** | **Polaris Web Component** | **Migration Notes** |
| - | - | - |
| `Avatar` | [Avatar](https://shopify.dev/api/customer-account-ui-extensions/polaris-web-components/media/avatar) | Available today |
| | [ButtonGroup](https://shopify.dev/api/customer-account-ui-extensions/polaris-web-components/actions/buttongroup) | Available today |
| `Card` | [Section](https://shopify.dev/api/customer-account-ui-extensions/polaris-web-components/structure/section) | Available today |
| `CustomerAccountAction` | [CustomerAccountAction](https://shopify.dev/api/customer-account-ui-extensions/polaris-web-components/actions/customeraccountaction) | Available today |
| `ImageGroup` | [ImageGroup](https://shopify.dev/api/customer-account-ui-extensions/polaris-web-components/media/imagegroup) | Available today |
| `Menu` | [Menu](https://shopify.dev/api/customer-account-ui-extensions/polaris-web-components/actions/menu) | Available today |
| `Page` | [Page](https://shopify.dev/api/customer-account-ui-extensions/polaris-web-components/structure/page) | Available today |
| `ResourceItem` | | Removed. Use [Section](https://shopify.dev/api/customer-account-ui-extensions/polaris-web-components/structure/section) |
## Additional components
In addition to the components above, you can also use Polaris web components in the Checkout library to build customer account UI extensions.
[More Polaris web components - Checkout components](https://shopify.dev/docs/api/checkout-ui-extensions/polaris-web-components)