Integrate with Existing Apps
The following diagram shows the overall flow for creating a CLI app. The steps in the red rectangle are covered in this article.
You can use the Wix CLI for Apps to work with existing apps that are already registered in the Wix Dev Center. This allows you to add new features to your app using the CLI without having to migrate the entire app to your CLI project.
Because the Wix CLI for Apps is a new tool, it does not yet support all Wix App features. By working with both the Dev Center and the CLI you can continue to create and manage existing app extensions in the Dev Center, and benefit from the CLI’s capabilities.
Follow these steps to integrate your app with the CLI.
Prerequisites
Before getting started, make sure you have the following set up:
- Node.js (v18.16.0 or higher)
- A Wix developer account.
- An existing Wix App.
Step 1 | Extend an existing app
To extend an existing app with a new Wix CLI for Apps project:
-
Run the following command:
コピー1 -
Choose Extend existing application.
-
Choose the app to extend.
-
Choose a package name for your project. The package name is the name of the package created locally for your project, and the name of the directory containing your project’s local files.
Development site
During the setup process, you will also be asked to choose or create a development site for your app. As you work locally with the CLI, you can use the CLI to open the different parts of your app on the development site in your browser.
What you get
Once the process is complete, you will have all the files for your app in a local directory with the package name you chose.
When working on the CLI extension project locally or in preview versions, you can only work with the app extensions that are registered in your CLI project. Other app extensions from the Dev Center are still loaded into your development site where you can preview and test them, but they will use their production versions.
Changes to your extension’s local files will not be reflected in the dev center until you create a new app version.
For more information about the local files generated for your app, see CLI App Structure.
Step 2 | Test the app
Your app won't be active on your development site at this stage, however, you can preview and test it in a local development environment.
To set up a local development environment, use the following command:
1
The CLI displays a menu. Type D to open a browser window with a preview of the app's dashboard page.
The development environment is set up for hot reloading, so any changes you make to your code will be reflected in the browser.
次のステップ
After completing the above steps, you have integrated your existing app into a Wix CLI app that you can experiment with and test locally.
You can now: