Skip to main content
The expo-target.config.js (or .json, .ts) file in each target directory defines how the Apple target is generated and configured. This page documents all available configuration properties.

​
Config Type

export type Config = {
  type: ExtensionType;
  name?: string;
  displayName?: string;
  bundleIdentifier?: string;
  icon?: string;
  frameworks?: string[];
  deploymentTarget?: string;
  appleTeamId?: string;
  entitlements?: Entitlements;
  colors?: Record<string, string | DynamicColor>;
  images?: Record<string, string | { "1x"?: string; "2x"?: string; "3x"?: string }>;
  exportJs?: boolean;
};

export type DynamicColor = {
  light: string;
  dark?: string;
};

export type ConfigFunction = (
  config: import("expo/config").ExpoConfig
) => Config;

​
Properties

​
type
ExtensionType
required
The type of extension to generate.Example:
type: "widget"
Supported types include: widget, clip, share, watch, intent, action, notification-content, notification-service, safari, and many more.
​
name
string
Name of the target. Will default to a sanitized version of the directory name.Example:
name: "MyWidget"
This name is used for the Xcode target name and other internal identifiers.
​
displayName
string
Optional custom name for CFBundleDisplayName. This is the user-facing name that appears on the device.Example:
displayName: "My Awesome Widget"
If not provided, the name property will be used.
​
bundleIdentifier
string
Bundle identifier for the target. Will default to a sanitized version of the root project + name.Example:
bundleIdentifier: "com.company.app.widget"
Tip: If the specified bundle identifier is prefixed with a dot (.), it will be appended to the main app’s bundle identifier:
bundleIdentifier: ".widget"  // becomes com.company.app.widget
​
icon
string
A local file path or URL to an image asset.Example:
icon: "./assets/widget-icon.png"
// or
icon: "https://example.com/icon.png"
The icon will be automatically resized for all required sizes and added to the target’s Assets.xcassets.
​
frameworks
string[]
A list of additional frameworks to add to the target.Example:
frameworks: ["UserNotifications", "Intents"]
Common frameworks are automatically added based on the target type. Use this to add additional frameworks your target needs.
​
deploymentTarget
string
Deployment iOS version for the target.Default: "18.0"Example:
deploymentTarget: "17.0"
​
appleTeamId
string
Apple team ID to use for signing the target.Example:
appleTeamId: "ABC123DEF4"
Defaults to whatever is used in the main App target.
​
entitlements
Entitlements
Optional entitlements to add to the target.Example:
entitlements: {
  "com.apple.security.application-groups": ["group.com.company.app"],
  "com.apple.developer.healthkit": true,
  "com.apple.developer.healthkit.access": ["health-records"]
}
See the Entitlements section for all available options.
​
colors
Record<string, string | DynamicColor>
Additional colors to generate in the Assets.xcassets. These will be available as UIColors in the native source.Example:
colors: {
  gradient1: "#FF0000",
  gradient2: { light: "#FF0000", dark: "#0000FF" },
  $accent: "steelblue",
  $widgetBackground: "dodgerblue"
}
Usage in Swift:
Color("gradient1")  // #FF0000 in light mode
Color("gradient2")  // #FF0000 in light mode, #0000FF in dark mode
See the Colors API for special color names like $accent and $widgetBackground.
​
images
Record<string, string | { '1x'?: string; '2x'?: string; '3x'?: string }>
Additional images to generate in the Assets.xcassets. These will be available as UIImages in the native source. The sources can be URLs or local file paths.Example:
images: {
  evan: "https://github.com/evanbacon.png",
  logo: {
    "1x": "./assets/logo.png",
    "2x": "./assets/[email protected]",
    "3x": "./assets/[email protected]"
  }
}
Usage in Swift:
Image("evan")  // displays the image
Image("logo")  // uses appropriate scale for device
See the Images API for more details.
​
exportJs
boolean
Should the release build export the JS bundle and embed it.Default: falseExample:
exportJs: true
Intended for App Clips and Share Extensions where you may want to use React Native.

​
Entitlements Type

The Entitlements type supports all standard Apple entitlements. Here are some commonly used ones:
​
com.apple.security.application-groups
string[]
App groups for shared data between targets. Values should be prefixed with group.Example:
entitlements: {
  "com.apple.security.application-groups": ["group.com.company.app"]
}
​
com.apple.developer.healthkit
boolean
Enable HealthKit capabilities.Example:
entitlements: {
  "com.apple.developer.healthkit": true
}
​
com.apple.developer.homekit
boolean
Enable HomeKit capabilities.
​
com.apple.developer.siri
boolean
Enable Siri integration.
​
com.apple.developer.associated-domains
string[]
Associated domains for universal links and app clips.Example:
entitlements: {
  "com.apple.developer.associated-domains": [
    "appclips:example.com",
    "webcredentials:example.com"
  ]
}
​
com.apple.developer.icloud-container-identifiers
string[]
iCloud container identifiers. Values should be prefixed with iCloud.Example:
entitlements: {
  "com.apple.developer.icloud-container-identifiers": [
    "iCloud.com.company.app"
  ]
}

​
Dynamic Configuration

You can export a function instead of an object to dynamically generate configuration based on the Expo config: 
// expo-target.config.js
module.exports = (config) => {
  return {
    type: "widget",
    name: "MyWidget",
    bundleIdentifier: `.${config.slug}-widget`,
    colors: {
      $accent: config.primaryColor || "blue"
    }
  };
};
The function receives the Expo config as an argument and must return a Config object.

​
Complete Example

// expo-target.config.js
module.exports = {
  type: "widget",
  name: "MyWidget",
  displayName: "My Awesome Widget",
  bundleIdentifier: ".widget",
  icon: "./assets/widget-icon.png",
  deploymentTarget: "17.0",
  frameworks: ["UserNotifications"],
  entitlements: {
    "com.apple.security.application-groups": ["group.com.company.app"]
  },
  colors: {
    $accent: "steelblue",
    $widgetBackground: "dodgerblue",
    gradient1: { light: "#FF0000", dark: "#0000FF" }
  },
  images: {
    logo: "./assets/logo.png",
    background: "https://example.com/bg.png"
  },
  exportJs: false
};

Build docs developers (and LLMs) love

Get started for freeTalk to us