theme dev
command

Uploads the current theme as the specified theme, or a development theme, to a store so you can preview it.

This command returns the following information:

A link to your development theme at http://127.0.0.1:9292. This URL can hot reload local changes to CSS and sections, or refresh the entire page when a file changes, enabling you to preview changes in real time using the store's data.

You can specify a different network interface and port using --host and --port.
A link to the editor for the theme in the Shopify admin.
A preview link that you can share with other developers.

If you already have a development theme for your current environment, then this command replaces the development theme with your local theme. You can override this using the --theme-editor-sync flag.

Note

You can't preview checkout customizations using http://127.0.0.1:9292.

Development themes are deleted when you run shopify auth logout. If you need a preview link that can be used after you log out, then you should share your theme or push to an unpublished theme on your store.

You can run this command only in a directory that matches the default Shopify theme folder structure.

Anchor to flagsFlags

The following flags are available for the theme dev command:

Anchor to --error-overlay <value> --error-overlay <value> string env: SHOPIFY_FLAG_ERROR_OVERLAY: Controls the visibility of the error overlay when an theme asset upload fails: - silent Prevents the error overlay from appearing. - default Displays the error overlay.
Anchor to --host <value> --host <value> string env: SHOPIFY_FLAG_HOST: Set which network interface the web server listens on. The default value is 127.0.0.1.
Anchor to --live-reload <value> --live-reload <value> string env: SHOPIFY_FLAG_LIVE_RELOAD: The live reload mode switches the server behavior when a file is modified: - hot-reload Hot reloads local changes to CSS and sections (default) - full-page Always refreshes the entire page - off Deactivate live reload
Anchor to --no-color --no-color env: SHOPIFY_FLAG_NO_COLOR: Disable color output.
Anchor to --notify <value> --notify <value> string env: SHOPIFY_FLAG_NOTIFY: The file path or URL. The file path is to a file that you want updated on idle. The URL path is where you want a webhook posted to report on file changes.
Anchor to --open --open env: SHOPIFY_FLAG_OPEN: Automatically launch the theme preview in your default web browser.
Anchor to --password <value> --password <value> string env: SHOPIFY_CLI_THEME_TOKEN: Password generated from the Theme Access app.
Anchor to --path <value> --path <value> string env: SHOPIFY_FLAG_PATH: The path where you want to run the command. Defaults to the current working directory.
Anchor to --port <value> --port <value> string env: SHOPIFY_FLAG_PORT: Local port to serve theme preview from.
Anchor to --store-password <value> --store-password <value> string env: SHOPIFY_FLAG_STORE_PASSWORD: The password for storefronts with password protection.
Anchor to --theme-editor-sync --theme-editor-sync env: SHOPIFY_FLAG_THEME_EDITOR_SYNC: Synchronize Theme Editor updates in the local theme files.
Anchor to --verbose --verbose env: SHOPIFY_FLAG_VERBOSE: Increase the verbosity of the output.
Anchor to -e, --environment <value> -e, --environment <value> string env: SHOPIFY_FLAG_ENVIRONMENT: The environment to apply to the current command.
Anchor to -n, --nodelete -n, --nodelete env: SHOPIFY_FLAG_NODELETE: Prevents files from being deleted in the remote theme when a file has been deleted locally. This applies to files that are deleted while the command is running, and files that have been deleted locally before the command is run.
Anchor to -o, --only <value> -o, --only <value> string env: SHOPIFY_FLAG_ONLY: Hot reload only files that match the specified pattern.
Anchor to -s, --store <value> -s, --store <value> string env: SHOPIFY_FLAG_STORE: Store URL. It can be the store prefix (example) or the full myshopify.com URL (example.myshopify.com, https://example.myshopify.com).
Anchor to -t, --theme <value> -t, --theme <value> string env: SHOPIFY_FLAG_THEME_ID: Theme ID or name of the remote theme.
Anchor to -x, --ignore <value> -x, --ignore <value> string env: SHOPIFY_FLAG_IGNORE: Skip hot reloading any files that match the specified pattern.

themedev

--error-overlay <value>
Controls the visibility of the error overlay when an theme asset upload fails: - silent Prevents the error overlay from appearing. - default Displays the error overlay.
```
string
```
--host <value>
Set which network interface the web server listens on. The default value is 127.0.0.1.
```
string
```
--live-reload <value>
The live reload mode switches the server behavior when a file is modified: - hot-reload Hot reloads local changes to CSS and sections (default) - full-page Always refreshes the entire page - off Deactivate live reload
```
string
```
--no-color
Disable color output.
```
""
```
--notify <value>
The file path or URL. The file path is to a file that you want updated on idle. The URL path is where you want a webhook posted to report on file changes.
```
string
```
--open
Automatically launch the theme preview in your default web browser.
```
""
```
--password <value>
Password generated from the Theme Access app.
```
string
```
--path <value>
The path where you want to run the command. Defaults to the current working directory.
```
string
```
--port <value>
Local port to serve theme preview from.
```
string
```
--store-password <value>
The password for storefronts with password protection.
```
string
```
--theme-editor-sync
Synchronize Theme Editor updates in the local theme files.
```
""
```
--verbose
Increase the verbosity of the output.
```
""
```
-e, --environment <value>
The environment to apply to the current command.
```
string
```
-n, --nodelete
Prevents files from being deleted in the remote theme when a file has been deleted locally. This applies to files that are deleted while the command is running, and files that have been deleted locally before the command is run.
```
""
```
-o, --only <value>
Hot reload only files that match the specified pattern.
```
string
```
-s, --store <value>
Store URL. It can be the store prefix (example) or the full myshopify.com URL (example.myshopify.com, https://example.myshopify.com).
```
string
```
-t, --theme <value>
Theme ID or name of the remote theme.
```
string
```
-x, --ignore <value>
Skip hot reloading any files that match the specified pattern.
```
string
```

export interface themedev {
  /**
   * The environment to apply to the current command.
   * @environment SHOPIFY_FLAG_ENVIRONMENT
   */
  '-e, --environment <value>'?: string

  /**
   * Controls the visibility of the error overlay when an theme asset upload fails:
- silent Prevents the error overlay from appearing.
- default Displays the error overlay.
      
   * @environment SHOPIFY_FLAG_ERROR_OVERLAY
   */
  '--error-overlay <value>'?: string

  /**
   * Set which network interface the web server listens on. The default value is 127.0.0.1.
   * @environment SHOPIFY_FLAG_HOST
   */
  '--host <value>'?: string

  /**
   * Skip hot reloading any files that match the specified pattern.
   * @environment SHOPIFY_FLAG_IGNORE
   */
  '-x, --ignore <value>'?: string

  /**
   * The live reload mode switches the server behavior when a file is modified:
- hot-reload Hot reloads local changes to CSS and sections (default)
- full-page  Always refreshes the entire page
- off        Deactivate live reload
   * @environment SHOPIFY_FLAG_LIVE_RELOAD
   */
  '--live-reload <value>'?: string

  /**
   * Disable color output.
   * @environment SHOPIFY_FLAG_NO_COLOR
   */
  '--no-color'?: ''

  /**
   * Prevents files from being deleted in the remote theme when a file has been deleted locally. This applies to files that are deleted while the command is running, and files that have been deleted locally before the command is run.
   * @environment SHOPIFY_FLAG_NODELETE
   */
  '-n, --nodelete'?: ''

  /**
   * The file path or URL. The file path is to a file that you want updated on idle. The URL path is where you want a webhook posted to report on file changes.
   * @environment SHOPIFY_FLAG_NOTIFY
   */
  '--notify <value>'?: string

  /**
   * Hot reload only files that match the specified pattern.
   * @environment SHOPIFY_FLAG_ONLY
   */
  '-o, --only <value>'?: string

  /**
   * Automatically launch the theme preview in your default web browser.
   * @environment SHOPIFY_FLAG_OPEN
   */
  '--open'?: ''

  /**
   * Password generated from the Theme Access app.
   * @environment SHOPIFY_CLI_THEME_TOKEN
   */
  '--password <value>'?: string

  /**
   * The path where you want to run the command. Defaults to the current working directory.
   * @environment SHOPIFY_FLAG_PATH
   */
  '--path <value>'?: string

  /**
   * Local port to serve theme preview from.
   * @environment SHOPIFY_FLAG_PORT
   */
  '--port <value>'?: string

  /**
   * Store URL. It can be the store prefix (example) or the full myshopify.com URL (example.myshopify.com, https://example.myshopify.com).
   * @environment SHOPIFY_FLAG_STORE
   */
  '-s, --store <value>'?: string

  /**
   * The password for storefronts with password protection.
   * @environment SHOPIFY_FLAG_STORE_PASSWORD
   */
  '--store-password <value>'?: string

  /**
   * Theme ID or name of the remote theme.
   * @environment SHOPIFY_FLAG_THEME_ID
   */
  '-t, --theme <value>'?: string

  /**
   * Synchronize Theme Editor updates in the local theme files.
   * @environment SHOPIFY_FLAG_THEME_EDITOR_SYNC
   */
  '--theme-editor-sync'?: ''

  /**
   * Increase the verbosity of the output.
   * @environment SHOPIFY_FLAG_VERBOSE
   */
  '--verbose'?: ''
}

Was this section helpful?

Theme dev

shopify theme dev [flags]

theme devcommand

Anchor to flagsFlags

themedev

examples

theme dev

theme dev

theme dev
command