<aside class="note">
<h4>Functions availability</h4>
<ul>
    <li>Users that have <a href="/docs/storefronts/themes/architecture/layouts/checkout-liquid"><code>checkout.liquid</code></a> customizations need to <a href="https://help.shopify.com/manual/checkout-settings/checkout-extensibility/checkout-upgrade">upgrade to Checkout Extensibility</a> to use Function APIs.</li>
    <li>Stores on any plan can use public apps that are distributed through the Shopify App Store and contain functions. Only stores on a <a href="https://help.shopify.com/manual/intro-to-shopify/pricing-plans/plans-features/shopify-plus-plan">Shopify Plus plan</a> can use <a href="https://help.shopify.com/manual/apps/app-types/custom-apps">custom apps</a> that contain <a href="/docs/api/functions">Shopify Function APIs</a>.</li>
    <li>Some Shopify Functions capabilities are available only to stores on a <a href="https://help.shopify.com/manual/intro-to-shopify/pricing-plans/plans-features/shopify-plus-plan">Shopify Plus plan</a>. See <a href="/docs/api/functions#availability-of-shopify-functions">Shopify Function APIs</a> for details.</li>
</ul>
</aside>


When you create a [function](/docs/apps/build/functions), the `shopify.extension.toml` file is automatically generated in your function extension directory. This guide describes the properties available in the `shopify.extension.toml` file.

## Anatomy of a function configuration file

The `shopify.extension.toml` file contains the extension's configuration, which includes the extension name, type, API version, UI paths, build configuration, and metafields for query variables.

<p>
<div class="react-code-block" data-preset="file">
<div class="react-code-block-preload ThemeMode-dim">
<div class="react-code-block-preload-bar "></div>
<div class="react-code-block-preload-placeholder-container">
<div class="react-code-block-preload-code-container">
<div class="react-code-block-preload-codeline-number"></div>
<div class="react-code-block-preload-codeline"></div>
</div>
<div class="react-code-block-preload-code-container">
<div class="react-code-block-preload-codeline-number"></div>
<div class="react-code-block-preload-codeline"></div>
</div>
<div class="react-code-block-preload-code-container">
<div class="react-code-block-preload-codeline-number"></div>
<div class="react-code-block-preload-codeline"></div>
</div>
<div class="react-code-block-preload-code-container">
<div class="react-code-block-preload-codeline-number"></div>
<div class="react-code-block-preload-codeline"></div>
</div>
<div class="react-code-block-preload-code-container">
<div class="react-code-block-preload-codeline-number"></div>
<div class="react-code-block-preload-codeline"></div>
</div>
<div class="react-code-block-preload-code-container">
<div class="react-code-block-preload-codeline-number"></div>
<div class="react-code-block-preload-codeline"></div>
</div>
<div class="react-code-block-preload-code-container">
<div class="react-code-block-preload-codeline-number"></div>
<div class="react-code-block-preload-codeline"></div>
</div>
<div class="react-code-block-preload-code-container">
<div class="react-code-block-preload-codeline-number"></div>
<div class="react-code-block-preload-codeline"></div>
</div>
<div class="react-code-block-preload-code-container">
<div class="react-code-block-preload-codeline-number"></div>
<div class="react-code-block-preload-codeline"></div>
</div>
<div class="react-code-block-preload-code-container">
<div class="react-code-block-preload-codeline-number"></div>
<div class="react-code-block-preload-codeline"></div>
</div>
<div class="react-code-block-preload-code-container">
<div class="react-code-block-preload-codeline-number"></div>
<div class="react-code-block-preload-codeline"></div>
</div>
<div class="react-code-block-preload-code-container">
<div class="react-code-block-preload-codeline-number"></div>
<div class="react-code-block-preload-codeline"></div>
</div>
<div class="react-code-block-preload-code-container">
<div class="react-code-block-preload-codeline-number"></div>
<div class="react-code-block-preload-codeline"></div>
</div>
<div class="react-code-block-preload-code-container">
<div class="react-code-block-preload-codeline-number"></div>
<div class="react-code-block-preload-codeline"></div>
</div>
<div class="react-code-block-preload-code-container">
<div class="react-code-block-preload-codeline-number"></div>
<div class="react-code-block-preload-codeline"></div>
</div>
<div class="react-code-block-preload-code-container">
<div class="react-code-block-preload-codeline-number"></div>
<div class="react-code-block-preload-codeline"></div>
</div>
<div class="react-code-block-preload-code-container">
<div class="react-code-block-preload-codeline-number"></div>
<div class="react-code-block-preload-codeline"></div>
</div>
<div class="react-code-block-preload-code-container">
<div class="react-code-block-preload-codeline-number"></div>
<div class="react-code-block-preload-codeline"></div>
</div>
<div class="react-code-block-preload-code-container">
<div class="react-code-block-preload-codeline-number"></div>
<div class="react-code-block-preload-codeline"></div>
</div>
<div class="react-code-block-preload-code-container">
<div class="react-code-block-preload-codeline-number"></div>
<div class="react-code-block-preload-codeline"></div>
</div>
<div class="react-code-block-preload-code-container">
<div class="react-code-block-preload-codeline-number"></div>
<div class="react-code-block-preload-codeline"></div>
</div>
<div class="react-code-block-preload-code-container">
<div class="react-code-block-preload-codeline-number"></div>
<div class="react-code-block-preload-codeline"></div>
</div>
<div class="react-code-block-preload-code-container">
<div class="react-code-block-preload-codeline-number"></div>
<div class="react-code-block-preload-codeline"></div>
</div>
<div class="react-code-block-preload-code-container">
<div class="react-code-block-preload-codeline-number"></div>
<div class="react-code-block-preload-codeline"></div>
</div>
<div class="react-code-block-preload-code-container">
<div class="react-code-block-preload-codeline-number"></div>
<div class="react-code-block-preload-codeline"></div>
</div>
<div class="react-code-block-preload-code-container">
<div class="react-code-block-preload-codeline-number"></div>
<div class="react-code-block-preload-codeline"></div>
</div>
<div class="react-code-block-preload-code-container">
<div class="react-code-block-preload-codeline-number"></div>
<div class="react-code-block-preload-codeline"></div>
</div>
<div class="react-code-block-preload-code-container">
<div class="react-code-block-preload-codeline-number"></div>
<div class="react-code-block-preload-codeline"></div>
</div>

</div>
</div>

<script data-option="filename" data-value="shopify.extension.toml"></script>

<script type="text/plain" data-language="toml">
RAW_MD_CONTENTapi_version = "2023-10"

[[extensions]]
name = "Product Discount"
handle = "product-discount"
type = "function"

  [[extensions.targeting]]
  target = "purchase.product-discount.run"
  input_query = "src/run.graphql"
  export = "run"

  [extensions.build]
  command = "cargo build --target=wasm32-wasip1 --release"
  path = "target/wasm32-wasip1/release/product-discount.wasm"
  watch = [ "src/**/*.rs" ]

  [extensions.ui]
  enable_create = true
  handle = "ui-extension-handle"

  [extensions.ui.paths]
  create = "/product-discount/:functionId/new"
  details = "/product-discount/:functionId/:id"

  [extensions.input.variables]
  namespace = "my-namespace"
  key = "my-key"
END_RAW_MD_CONTENT</script>

</div>
</p>


## Properties

Functions use [common configuration properties](/docs/apps/build/app-extensions/configure-app-extensions#common-properties) for app extensions. Additionally, the following table describes the specific properties for Shopify Functions extensions available in `shopify.extension.toml`:

| Property | Description  |
|---|---|
| `[[extensions.targeting]]`<br><span class="heading-flag">Required</span> | The name of the array that contains a target and its associated WebAssembly module export. Contains the following properties:<br></br><ul><li>`target`:<span class="heading-flag">Required</span> An identifier that specifies where you're injecting code into the Shopify backend. Refer to the [Function API references](/docs/api/functions) for available function targets.</li><li>`input_query`:<span class="heading-flag">Optional</span> The path to the [input query](/docs/apps/build/functions/input-output#input) file for the target. If omitted, then the function receives no input.</li><li>`export`:<span class="heading-flag">Optional</span> The name of the [WebAssembly](/docs/apps/build/functions/programming-languages/webassembly-for-functions) export in your module that executes for the target. Functions don't use the `extensions.targeting.module` setting. Use `export` instead. Defaults to `_start`. </li></ul> |
| `[extensions.build]`<br><span class="heading-flag">Optional</span> | The settings related to the build and deployment of the function extension's WebAssembly module. Contains the following properties:<br></br><ul><li>`command`:<span class="heading-flag">Optional</span> The command to build the function, which is invoked by the Shopify CLI [`build` command](/docs/api/shopify-cli/app/app-build).</li><li>`path`:<span class="heading-flag">Optional</span> The relative path to the function's [WebAssembly](/docs/apps/build/functions/programming-languages/webassembly-for-functions) module. For example, `build/my-module.wasm`.  Defaults to `dist/index.wasm`.</li><li>`watch`:<span class="heading-flag">Optional</span> The relative paths that Shopify CLI should watch when the [`dev` command](/docs/api/shopify-cli/app/app-dev) is invoked. Changes to matched files trigger a build of the function and update it in your application drafts. This setting accepts a single file path or glob pattern, or an array of file paths and glob patterns.<br><br>For JavaScript and TypeScript functions, this setting defaults to `['src/**/*.js', 'src/**/*.ts']`..<br><br>Only paths inside the function directory are allowed (no "../").<br><br>[Input queries](/docs/apps/build/functions/input-output/metafields-for-input-queries) are automatically included in watch paths and don't need to be configured in `build.watch`.</li><li>`wasm_opt`:<span class="heading-flag">Optional</span> Whether to optimize your module before upload. Defaults to `true`.</li></ul> |
| `[extensions.ui]`<br><span class="heading-flag">Optional</span> | The settings related to the [merchant interface](/docs/apps/build/functions/input-output/metafields-for-input-queries#creating-your-merchant-interface) for your function. Contains the following properties:<br></br><ul><li>`handle`: <span class="heading-flag">Optional</span> Learn how to [create your function merchant interface](/docs/apps/build/functions/input-output/metafields-for-input-queries#creating-your-merchant-interface).</li><li>`enable_create`:<span class="heading-flag">Optional</span> Learn how to [configure creation workflows for function owners](/docs/apps/build/functions/input-output/metafields-for-input-queries#configuring-creation-workflows-for-function-owners).</li></ul> |
| `[extensions.ui.paths]`<br><span class="heading-flag">Optional</span> | The settings related to the App Bridge paths of the [merchant interface](/docs/apps/build/functions/input-output/metafields-for-input-queries#creating-your-merchant-interface) for your function. Contains the following properties:<br></br><ul><li>`create`:<span class="heading-flag">Optional</span> Refer to [create your function merchant interface](/docs/apps/build/functions/input-output/metafields-for-input-queries#creating-your-merchant-interface).</li><li>`details`:<span class="heading-flag">Optional</span> Refer to [create your function merchant interface](/docs/apps/build/functions/input-output/metafields-for-input-queries#creating-your-merchant-interface).</li></ul> |
| `[extensions.input.variables]`<br><span class="heading-flag">Optional</span> | The [variables to use in your input query](/docs/apps/build/functions/input-output/use-variables-input-queries). Contains the following properties:<br></br><ul><li>`key`: The name for the metafield.</li><li>`namespace`: A container for a group of metafields. Grouping metafields within a namespace prevents your metafields from conflicting with other metafields with the same key name.</li></ul> |


## Properties for earlier versions

The following table describes the properties available in `shopify.extension.toml` or `shopify.function.extension.toml` file, for API versions 2023-07 and earlier:

| Property  | Required? | Description  |
|---|---|---|
| `name`  | Yes | The name of the function. |
| `type` | Yes | The [type of extension](/docs/apps/build/cli-for-apps/app-structure#extensions). |
| `api_version` | Yes | The version of the Function API. |
| `ui.enable_create` | No | Refer to [configuring creation workflows for function owners](/docs/apps/build/functions/input-output/metafields-for-input-queries#configuring-creation-workflows-for-function-owners). |
| `ui.paths.create` | No | Refer to [create your function merchant interface](/docs/apps/build/functions/input-output/metafields-for-input-queries#creating-your-merchant-interface). |
| `ui.paths.details`| No | Refer to [create your function merchant interface](/docs/apps/build/functions/input-output/metafields-for-input-queries#creating-your-merchant-interface). |
| `build.command`| Yes | The command to build the function which is invoked by the Shopify CLI [build command](/docs/api/shopify-cli/app/app-build). |
| `build.path`| No | The relative path to the function's [WebAssembly module](/docs/apps/build/functions/programming-languages/webassembly-for-functions). For example, `build/my-module.wasm`.  Defaults to `dist/index.wasm`. |
| `build.watch` | No | The relative paths that Shopify CLI should watch when the [`dev` command](/docs/api/shopify-cli/app/app-dev) is invoked. Changes to matched files trigger a build of the function and update it in your application drafts. This setting accepts a single file path or glob pattern, or an array of file paths and glob patterns.<br><br>For JavaScript and TypeScript functions, this setting defaults to `['src/**/*.js', 'src/**/*.ts']`.<br><br>Only paths inside the function directory are allowed (no "../").<br><br>[Input queries](/docs/apps/build/functions/input-output/metafields-for-input-queries) are automatically included in watch paths and don't need to be configured in `build.watch`. |
| `input.variables`| No | Refer to [use variables in input queries](/docs/apps/build/functions/input-output/use-variables-input-queries). |


## Next steps

- Learn how to replace hard-coded variables in your function with [metafield values](/docs/apps/build/functions/input-output/metafields-for-input-queries).
- Learn how to [use variables in input queries](/docs/apps/build/functions/input-output/use-variables-input-queries) with Shopify Functions.