@zoovu/exd-scripts

The @zoovu/exd-scripts package includes build scripts and development tools for working with extensions in Experience Designer. Use it to serve your extension during development, create production builds, and manage versioning.

Installation

The package is usually included in your extension project as a development dependency. You can find it in the devDependencies section of package.json:

"devDependencies": {
  "@zoovu/exd-scripts": "2.1.0"
}

INFO: Make sure you are using Node.js version 20.

Usage

The package provides a command-line tool called zoovu-experience-designer-scripts. It's typically used through yarn or npm scripts in your project.

Example scripts section in package.json:

"scripts": {
  "dev": "zoovu-experience-designer-scripts remote-component dev",
  "bump-version": "zoovu-experience-designer-scripts remote-component bump-version",
  "build": "zoovu-experience-designer-scripts remote-component build"
}

You can run these scripts using:

yarn dev
yarn build
yarn bump-version

Available commands

Start development server

zoovu-experience-designer-scripts remote-component dev

This starts a local development server that:

• compiles your extension
• watches for changes and reloads automatically
• makes the extension available for testing in Experience Designer for developers

Go to https://orca-experience.zoovu.com/developer to test the extension. Refresh the page at least once after running the script.

Create a production build

zoovu-experience-designer-scripts remote-component build

Creates an optimized version of your extension for production. This includes:

• minified JavaScript and CSS
• optimized assets
• a build directory with everything needed for upload
• a .zip archive that you can drag and drop into Experience Designer

After running the script, check the build folder for:

• bundled files
• component.zip archive
• manifest JSON with metadata

Bump extension version

zoovu-experience-designer-scripts remote-component bump-version

Increments the version number in your package.json. Use this when you're uploading a new version of the extension to Experience Designer.