Developers - CLI and Themes
Themes and CLI
Installation
To globally install the Perfection Command Line Interface, which is necessary for syncing, updating, and deleting Themes, utilize the provided NPM package.
- Npm
- Yarn
- Pnpm
- Bun
npm install -g @perfectiondev/cli
yarn global add @perfectiondev/cli
pnpm i -g @perfectiondev/oversite-helpers
bun add -g @perfectiondev/oversite-helpers
When completed, maker sure the command line interface is installed properly by executing the following command. It should return the CLI version number installed.
perfection --version
Files structure
Before you start creatin your first theme, we recommend you to created a perfection directory at the root of your project. This folder will contains all the Themes and Components configuration files that will be synced with our CLI, see this example:
├── root
│ ├── perfection
│ │ ├── theme.json
│ │ ├── perfection.json
│ │ ├── components
│ │ │ ├── component-name.json
│ │ │ ├── hero-banner.json
│ │ │ ├── product-card.json
│ │ │ ├── ...
To grasp the purpose of each file type, begin by exploring the following pages:
CLI commands
This section describe all the CLI commands you can use to create, update, sync and delete themes and components with your account.
Config command
The config command allows you to change your CLI credentials in a locally stored configuration file. The configuration file scaffolded by this command can be used by other CLI commands to use its properties as a default for the command flags.
By default, this command will store the provided values in a perfection.json file stored in the command execution folder.
The contents of the file will only contain the values of the flags provided.
perfection config set --apiKey=YOUR_API_KEY --subscription=YOUR_SUBSCRIPTION_ID --baseUrl=API_ENDPOINT
The config set command has the following options:
| Option | Required | Description |
|---|---|---|
| --apiKey=[value] | Yes | Personal API access key |
| --subscription=[value] | Yes | Subscription ID |
| --baseUrl=[value] | -- | API base url. Default value set to our production endpoint |
| --config=[value] | -- | Relative path to the configuration file. Default value = 'perfection.json' |
Read more here about perfection.json configuration file.
Create command
The create command allows you to create a new theme straight from the CLI. The syntax for this command is as follows
perfection app theme create -f <value> [options]
The app theme create command has the following options:
| Option | Required | Description |
|---|---|---|
| -f, --file=[value] | Yes | File path and name to be created |
| -k, --key=[value] | -- | Theme key |
| -n, --name=[value] | - | Theme name |
| -d, --description=[value] | -- | Theme description |
| --apiKey=[value] | -- | Personal API access key |
| --subscription=[value] | -- | Subscription ID |
| --baseUrl=[value] | -- | API base url |
| --config=[value] | -- | Relative path to the configuration file |
| --json | -- | Format output as json |
Read more here about theme.json configuration file.
Sync command
The sync command allows you to update an existing theme from the CLI.
The syntax for this command is as follows
perfection app theme sync -f <value> [options]
The app theme sync command has the following options:
| Option | Required | Description |
|---|---|---|
| -f, --file=[value] | Yes | File path and name to be created |
| --apiKey=[value] | -- | Personal API access key |
| --subscription=[value] | -- | Subscription ID |
| --baseUrl=[value] | -- | API base url |
| --config=[value] | -- | Relative path to the configuration file |
| --json | -- | Format output as json |
Read more here about theme.json configuration file.
If you want to only sync your components from the CLI.
The syntax for this command is as follows
perfection app components sync -f <value> [options]
The app components sync command has the following options:
| Option | Required | Description |
|---|---|---|
| -f, --file=[value] | Yes | Theme file path to be synced with |
| --apiKey=[value] | -- | Personal API access key |
| --baseUrl=[value] | -- | API base url |
| --config=[value] | -- | Relative path to the configuration file |
| --subscription=[value] | -- | Subscription ID |
| --json | -- | Format output as json |
Read more here about component.json configuration files.
Delete command
The delete command allows you to delete an existing theme.
The syntax for this command is as follows
perfection app theme delete -k <value> [options]
The app theme create command has the following options:
| Option | Required | Description |
|---|---|---|
| -k, --key=[value] | Yes | Theme key |
| --apiKey=[value] | Optional | Personal API access key |
| --subscription=[value] | Optional | Subscription ID |
| --baseUrl=[value] | Optional | API base url |
| --config=[value] | Optional | Relative path to the configuration file |
| --json | Optional | Format output as json |