This feature is in beta and subject to change.
Improved app dev command
The Next-Gen Dev Platform is not yet generally available. Currently, access to these tools and features is limited to organizations participating in an invitation-only early access program. To request entry into the early access program, submit a request.
Visit our dev community to discuss the Next-Gen Dev Platform and provide feedback.
Use the app dev Shopify CLI command to develop, preview, and test your app on development stores. This command includes a number of improvements when used with the Next-Gen Dev Platform:
- Changes made to your app while running
app dev
are isolated to an app preview on your chosen development store. They are not visible to other development stores or production installations of your app. - All changes to your app configuration can be previewed on your development store, without the need to run
app deploy
. - Extension additions and deletions are included in the app preview, without the need to restart
app dev
. - You can preview your app on any Shopify plan that is available for development stores.
- Your app is automatically installed on your chosen development store.
- Access scope changes are automatically accepted on your chosen development store when you change them in the
shopify.app.toml
. - The app preview created during
app dev
remains on your development store until you runapp dev clean
or uninstall the app. - The Dev Console in the Shopify Admin will inform you about any active app previews on the store.
Anchor to Overview of ,[object Object]Overview of app dev
app dev
To preview your app on a development store, Shopify CLI walks you through selecting a development store to use for testing. If you have only one store, then it's selected automatically.
If you've run dev
before, then your settings are saved and some of these steps are skipped. You can reset these configurations using app dev --reset
.
While running, app dev
performs the following tasks:
- For apps with extensions or CLI-managed configuration, it creates an app preview on your chosen development store, and a file watcher to sync local changes with that app preview.
- For apps with web files, such as those based on the Remix app template, it serves your self-hosted embedded app.
- For apps with extensions that support browser-based preview, such as UI extensions, it starts a local development server for hot module reloading.
- It serves a reverse proxy that routes to these local servers.
- It sets up external networking for that proxy server.
- It serves GraphiQL for the Admin API using your app's credentials and access scopes.
Anchor to When ,[object Object], stopsWhen app dev
stops
app dev
stopsWhen you stop the app dev
command, the app preview remains on your store. Your app configuration and extensions will remain active there, unless you run shopify app dev clean
.
The app dev clean
command restores the active released version of your app on your store. If any extensions or configuration are removed in this process, their related data is deleted as well. For example:
- A Discount function you added during
app dev
isn't in the active app version. Any discounts referencing it are deleted. - A UI extension you placed and configured via the Checkout Editor isn't in the active app version. This placement and configuration are deleted.
Anchor to Comparison to previous ,[object Object], behaviorComparison to previous app dev
behavior
app dev
behaviorThe behavior of the app dev
command has significant changes for organizations that are using the Dev Platform. Organizations using the Partner Dashboard will still experience the previous behaviors of the command when running app dev
.
Given the isolation of changes to a single development store, teams using the Dev Platform can safely share a single development copy of an app.
Behavior | Dev Platform | Partner Dashboard |
---|---|---|
Isolation of changes | Changes made during dev are visible only to the chosen development store. | Changes made during dev are visible to any development store in the organization. |
App URL updates | Updates the app preview to use the current tunnel or localhost URL, only for the chosen development store. The URL is visible in the Dev Console in Shopify admin. | Updates the app URL for all installed shops. |
Inclusion of app configuration | All changes to app configuration are available in the app preview. | Changes to app configuration require a deploy . |
Inclusion of new and removed extensions | Adding and removing extensions updates the app preview. | The dev command must be restarted when extensions are added or removed. |
Shopify plan support | Supports any Shopify plan that is available for development stores. | Full support for Partner Test stores, partial support for Plus Sandbox stores. |
App installation | The app is automatically installed on the chosen development store. | You must install the app. |
Access scopes | Changes to access scopes are automatically accepted on the chosen development store. | You must deploy and accept the scope changes. |
Shutdown behavior | The app preview remains active on the development store. | The development store reverts to the current released version of the app. Objects with references to extensions not in this version are non-functional. |
App preview status | The Dev Console in Shopify admin alerts you of active app previews. | There is no indication of an active preview. |