Add Service Plugin Extensions with the CLI

Service plugin extensions (formerly SPIs) are a set of APIs defined by Wix that you can use to enable your app to inject custom logic into existing app flows or to introduce entirely new flows to Wix sites.

You can implement service plugin extensions in your app using the CLI.

Follow the instructions below to:

1. Create a service plugin extension for your app.
2. Test your service plugin extension.

Once this task is complete, your app will have a service plugin extension with custom functions that Wix calls during a specific flow.

Before you begin

• You must have an app project that was created using the Wix CLI.
• You must be logged into your Wix Developer account. If you don’t have one, sign up for a Wix Developer account.

Step 1 | Create the extension

In the terminal:

1. Navigate to your project repo.

2. Run the following command:

   Copy

   1
   
   

3. The CLI will display a menu of extensions to generate. Select Service Plugin and hit enter to continue.

4. The CLI will prompt you to select a service plugin from a list of available service plugins.

5. The CLI will prompt you to name your service plugin. This is the name of the folder in the project repo that contains the service plugin code, and the name of the plugin in the Wix Dev Center. Only you will see this name.

Upon completion, the extension files will be created in your project directory with the following structure:

1

• plugin.ts - This file is required and contains handler functions that Wix calls automatically when the relevant site action triggers them. These functions are where you add your custom logic.
• plugin.json - This file is required and provides all required configuration for your plugin.

Step 2 | Test your service plugin extension

To test your service plugin extension you must:

1. Add logging inside your backend logic.
2. Create a version with your changes.
3. Trigger the call to your service plugin.

Logging in backend logic can't be tested in the CLI's local development environment (npm run dev). Instead, you must trigger the service plugin from your development site on a deployed version (npm run create-version).

Your development site uses the latest version of your app in the Dev Center. To ensure local changes are reflected in the app on your site, you must create a new version.

Add logging inside your backend logic

Inside your plugin.ts file, add a console.log() command to one of your functions. For example:

1

Create a version with your changes

1. Run the following command to build your app:

   Copy

   1
   
   

2. Run the following command and follow the prompts to create an app version:

   Copy

   1
   
   

For more information about building and deploying your app, see Build and Deploy an App with the CLI.

Trigger the call to your service plugin

The process for triggering the call to your service plugins depends on the type of service plugin.

Follow these steps to navigate to your development site or its dashboard and trigger the call to the service plugin:

1. From your app's directory in the terminal, run the following command:

   Copy

   1
   
   

   Replace <version> with the number of the version you created.

2. Go to wix dashboard and open the site or dashboard you installed the app on.

3. Take an action that will trigger your service plugin call. The logs you set up will appear in the terminal.

Delete a service plugin extension

To delete a service plugin extension from your app, delete the subfolder under src/backend/service-plugins that contains your service plugin extension's files.

Summary

You now have a service plugin extension configured in your app.

For more information about this plugin's files, see Service Plugin Extension Files and Code.