Follow the instructions in the Web Applications SDK page to set up your development environment.
A working knowledge of TypeScript is recommended before extending Workflow for web-based hosts.
Adding a Dependency
- Install the dependency in the activity sdk. For example,
npm install moment.
- Copy the dependency to
It's important that you copy and not move the dependency from the
node_modules folder, as this will make it accessible to both the development server and production activity pack.
- Add a call to
For example, if you wanted to use the moment.js library and had the file
moment.js located in a folder called
deps/moment within the
dist folder, you would write the following:
The root that the library path refers to is the
dist folder, and the
.js suffix on the library file should be omitted.
moment.jslibrary to return the current date and time in a human readable format.
If the external dependency has other dependencies, you will need to call
mapDependencies for each one.
Reference External React Components
If your Activity Pack contains a custom form element that relies upon an external React component, you need to add a call to
mapDependencies() to the
configure() method in
src/main.ts, the same as for other external libraries.
react-circular-color Component.Example: Using the
npm install react-circular-colorin the terminal.
- Follow the instructions above to create and register a new custom form element
ColorPicker.tsxReact component that just returns a single color picker.
- Copy the
react-circular-colorfolder from your
- Add a call for
There are some limitations on the types of component you can load: