Upgrading the CLI

👉

Current available version is CLI 2.0.0-beta.9

Upgrading from CLI 1.x.x to 2.0.0

CLI 1.x.x compatability

CLI 1.x.x is compatible with latest Interplay release.

So the previous CLI version 1.0.19 is compatible with the latest Interplay API (Sep 2021).

Changes in CLI 2.x.x

Changes to settings file structure

CLI 2.x.x uses a slightly different settings file structure from CLI 1.x.x. and is not compatible with the old interplay.json configuration file.

Previously there were the following two settings files for the CLI, stored in the interplay folder:

  • interplay.json for the configuration settings
  • interplay.js (optional) for the modifiers functions and event handlers

These have been re-organised into a new .interplay folder

  • interplay.config.js that combines the old settings
  • targets.json which can contain multiple team/project targets for your deploys. It defaults to one single default target. This allows you to easily deploy the same repo to different projects in Interplay

Preset Handling

CLI 1.x.x had 2 different preset parsing modes, and only limited control of which component instances in parsed story/docs files were selected for import as presets (examples) - for example:

  • a Button preset (example) could be generated from instances in Button.story.js, but could also be generated from a Button instance found in Card.story.js.
  • It could be difficult to extract the correct instances where the stories had layout wrapper components

CLI 2.x.x consolidates these parsing modes into a single parsing mode, and now supports preset matching rules, which allow you to set rules for which intances will be matched in each file. For example you can specify:

  • when parsing Button.story.js, only use instances of Button as presets
  • when parsing Icon.story.js, ignore the story's Layout and Spacing components and only import components whose path matches src/components/icon/

Because of this different processing, a slightly different set of presets will likely be returned by CLI 2.x.x compared to CLI 1.x.x.. The additional control should mean we can curate these presets more accurately. We can help you update these settings - please contact us when you are ready to upgrade.

For more details about presetRules, please see

Upgrade steps

👉

We would love to help you upgrade - please let us know and we can run through these steps on a call together.

  1. Install CLI 2.0.0 - currently in beta - using: npm install -g @interplay/cli@next @interplay/cli-plugin-react@next
  2. Run interplay --version to verify the correct latest version is showing
  3. Run interplay init to select the new or existing project you are importing to. This will create 2 new template settings files:
  4. .interplay/interplay.config.js

    .interplay/targets.json

  5. Delete the teamId and projectId from your old interplay/interplay.json . The CLI will use the project you selected in step 3 (stored under default in targets.json file.
  6. Cut and paste the remaining settings from interplay.json and interplay.js into interplay.config.js
  7. Adjust the default presetRules in interplay.config.js as required for your repo (we can help you do this)
  8. Run the stages of the new CLI in sequence and check each stage completes as expected:
  9. interplay build - will output build to .interplay/stage/files

    interplay parse - will output build to .interplay/stage/config

    interplay deploy - deploys the files and config from .interplay/stage together with any local include files or deploy files specified.

    (As before, you can run all stages at once using interplay with no parameters)

  10. You can rename the old interplay folder to archive it, as it is not used by CLI 2+. Please update your gitignore settings to save your new CLI config
  11. //.gitignore
    //ignore subfolders of .interplay unless you have added files to save
    .interplay/*/