Set Up Git Integration & Wix CLI

Git Integration & Wix CLI allows you to write, test, preview, and publish code for your Wix site from your preferred IDE. This article explains how to set up Git Integration & Wix CLI by connecting your site to GitHub, cloning your site's GitHub repository to your computer, and installing the Wix CLI.

Note: You can also clone the repo to a cloud IDE workspace, then install and use the Wix CLI there.

Step 1 | Connect your site to GitHub

To write your site's code locally from your computer, first create a GitHub repo to store your site's code and connect it to your site.

Important:

  • You can't connect your site to GitHub if you have Velo Packages set up on your site. This feature isn't supported when using Git Integration & Wix CLI. However, you can connect your site to GitHub if you have npm packages installed on your site.
  • Once you connect your site to GitHub be careful not to delete your site's repo or revoke the Velo app's access to this repo. These actions may cause your site's GitHub connection to stop working even if you restore the repo or reinstall the app.

Before getting started, if you haven't already done so, click Code icon and then Start Coding (Wix Studio), or enable Velo Dev Mode (Wix Editor).

  1. Go to the GitHub Integration section of your editor:

    • Wix Studio: In the Code sidebar, click GitHub then Connect to GitHub.

    Connect to GitHub

    • Wix Editor: Click the GitHub Integration icon in the Code sidebar and then Connect to GitHub.
  2. Click Continue.

  3. Click Sign In.

    Follow the prompts to sign in to your GitHub account and authorize Velo to create a new repo for you.

  4. Choose an owner and enter a name for the new repo to connect to your site. Optionally, you can add a custom description as well. Click Create.

  5. Click Install to start installing the Velo GitHub app on your new repo.

    This app allows your site to communicate with GitHub. You may need to authenticate your identity in GitHub before continuing.

  6. Make sure that both Only select repositories and your new repo are selected. Click Approve and Install.

  7. Copy the displayed terminal commands. You need them for the next section of the setup.

  8. Click Close.

    Your repo name and default branch are displayed in the GitHub Integration panel.

Once you connect your site to GitHub, your editor enters read-only mode.

You can always choose to disconnect your site from GitHub.

Step 2 | Set up your local environment

Once your site's repo it set up, you can clone it to your computer and install the Wix CLI. The commands used in this procedure accomplish the following:

  • Clone your site's repo to your computer.
  • Install the repo's dependencies.
  • Install the Wix CLI globally on your computer.

Before getting started, make sure you have the following things installed:

To set up your local environment, do the following:

  1. Open the terminal on your computer.

  2. Navigate to the directory where you want to store your repo's files.

  3. Run the commands you copied down in the previous section. Depending on your computer's setup, you may need administrator privileges to run the commands.

    To see the commands again, open your site's editor and click Local Dev Setup.

    The default commands use npm as the package manager for installations. You can also use yarn to manage packages. To do this, make the following changes:

    • Change npm install to yarn install.
    • Change npm install -g @wix/cli to yarn global add @wix/cli.

    After the installation, the Local Editor opens in your default web browser.

  4. Open the repo in your favorite local IDE to start writing code.

Step 3 | Set up the Wix CLI

The CLI is a package that you install on your computer.

  1. Open your computer's terminal.
  2. Run npm install -g @wix/cli or yarn global add @wix/cli.

Once you've installed the CLI globally, you can use it with any Wix site repos on your computer.

Next Steps

You're ready to start writing your site's code, and testing it with the Local Editor

Did this help?