UI tools

Grow's development server comes with the ability to add tools that expand the development experience.

Tools

Many tools can be found and installed using NPM by looking for the grow-tool- prefix.

Some examples include:

Installing

For basic installations:

Add the tool to the project's package.json dev dependencies:

"devDependencies": {
  "grow-tool-analytics-highlight": "^0.0.5"
}

Run grow install to install the new dependency.

Update the podspec.yaml to enable the new tool:

# Setting for specific deployments.
deployments:
  staging:
    # Other settings...
    ui:
      tools:
      - kind: image-swap

# Settings for dev server.
ui:
  tools:
  - kind: analytics-highlight
    options:
      prefix: event

CDNs and Local Sources

Tools can also be hosted on third party systems such as CDNs or within the project:

ui:
  tools:
  - kind: analytics-highlight
    paths:
      script: https://some.cdn.com/grow/ui/tool.js
      style: https://some.cdn.com/grow/ui/tool.css

Custom Tools

There is an basic example project for creating custom tools: grow-tool-template.