To get you up and running and building extensions, we will be using the open-source scaffolding tool, generously provided by Adobe’s Launch engineers to create the necessary files and file structure for your extension package, so all you have left to do is the valuable part: actually write the code.


The installed version of Node.js may be verified by running:

$ npm -v

Extension Setup

Create a directory where your extension files will live.

$ mkdir example && cd example

Initialize a package.json file within the directory.

$ npm init

The values provided here are for development purposes only. They will not be used in the published extension.

Install the @adobe/reactor-scaffold package from NPM.

$ npm install @adobe/reactor-scaffold --save-dev

Add @adobe/reactor-scaffold to the project’s devDependencies in package.json.

Building the Extension

While this could be done manually, this guide utilizes the extension scaffolding tool to build-out the extension structure so developers can quickly begin coding.

Run the scaffold tool.

$ node_modules/.bin/reactor-scaffold

The scaffold tool will prompt for some initial configuration options as follows:

  • Display name - The visible name of the extension
  • Version - The version of the extension
  • Description - A short description of the extension’s purpose
  • Author - The name of the extension’s author

The scaffold tool will then provide options for building the extension structure:

  • Extension configuration view - The view, HTML file, through which an extension gathers global settings from an user.
  • Event type - Defines an activity for observation. For example, know when a user scrolls rapidly, or a user interacted with a page element. Events can then be utilized in rules to perform actions.
  • Condition type - Condition types evaluate whether something is true or false. For example, this can return if the user’s browser is Chrome, if they’re using an iPad, or if the user is on a specific domain.
  • Action type - The action to perform when an event occurs. For example, send an analytics beacon, show an offer, save a cookie, or open a support chat.
  • Data element type - A data element type retrieves a piece of data. This data could be in local storage, in a cookie, in a DOM element, or in a custom location.
  • Shared module - A shared module is a mechanism by which extensions may communicate with other extensions.
  • Views - Each event, condition, action, or data element type may provide a view allowing a user to supply settings.
  • Subsequent runs of the scaffolding tool will skip over the initial configuration.
  • More than one of each event, condition, action, may be added.
  • Only one configuration view may exist.