Skip to content

Update a local environment to load application code

The VIP Local Development Environment is designed specifically for code development and testing for a VIP Platform application. A VIP Local Development Environment can be configured to run with a local git clone of an application’s wpcomvip GitHub repository. A local environment running with application code will respond to updates made to the local code without restarting, including code changes resulting from branch switching initiated by a git command.

Branch switching and pushing code updates to an application’s GitHub repository must be managed by git or a git GUI client.

Prerequisites

On the user’s local machine:

Clone an application’s GitHub repository

To be accessible by a VIP Local Development Environment, a clone of an application’s GitHub repository must exist locally.

  1. Obtain the URL for the application’s wpcomvip GitHub repository (e.g., https://github.com/wpcomvip/example-repo). This can be found in the dashboard panel of the application’s VIP Dashboard.
  2. Navigate to the application’s wpcomvip GitHub repository.
  3. Follow GitHub’s instructions for cloning a repository to a local machine.
    For most users, this step can be completed with a git command.

In this git clone command example, a repository found at the URL https://github.com/wpcomvip/example-repo is cloned to a local machine:
git clone git@github.com:wpcomvip/example-repo.git

Update the --app-code option

The next steps assume that a user has created a VIP Local Development Environment with an assigned --slug value example-site, and has cloned an application’s wpcomvip GitHub repository code to their local machine.

  1. Identify the absolute local path for the git cloned application repository directory. A repository that has been cloned locally to a macOS Desktop will have a path that looks similar to:
    /Users/example-user/Desktop/example-repo
  2. Use the vip dev-env update command to update the --app-code option for the local environment to with the path to the local repository directory.
    In this command example, the --app-code option is updated with the absolute path example from Step 1:
    vip dev-env update --app-code=/Users/example-user/Desktop/example-repo --slug=example-site
  3. Confirm other environment settings in the setup wizard:
    • PHP version to use · Select the Enter or Return key to accept the default version.
    • WordPress – Which version would you like · Select the Enter or Return key to accept the highlighted default version.
    • How would you like to source vip-go-mu-plugins · Select the Enter or Return key to accept the default value “Demo”. This will automatically load the staging branch of VIP MU plugins on the created local environment.
    • Enable Elasticsearch (needed by Enterprise Search)? (y/N) · Select the Enter or Return key to accept the default value “false”.
    • Enable phpMyAdmin (y/N) · Select the Enter or Return key to accept the default value “false”.
    • Enable XDebug (y/N) · Select the Enter or Return key to accept the default value “false”.
    • Enable Mailpit (y/N) · Select the Enter or Return key to accept the default value “false”.
    • Enable Photon (y/N) · Select the Enter or Return key to accept the default value “false”.
  4. Restart the environment:
vip dev-env start --slug=example-site
  1. Confirm that the environment is up and running by copying the first listed NGINX URLS value and loading it in a browser window: http://example-site.vipdev.lndo.site/

A successfully running environment will have a core WordPress theme enabled and display a default “Hello World!” post on the home page.

  1. Access the WordPress log in portal for the running environment by copying the LOGIN URL value and loading it in a browser window: http://example-site.vipdev.lndo.site/wp-admin/ 
  2. Retrieve the default login credentials for a VIP Local Development Environment with the info command:
vip dev-env info --slug=example-site
  1. Access the WordPress Admin dashboard of the running environment by entering the default log in credentials then select the “Log in” button.
  2. Navigate to the Plugins screen. If the local environment is running with the locally cloned code, plugins from that repository will be listed in the Plugins screen.

Theme and plugin directories on the local environment

A local environment that has successfully configured --app-code to run locally cloned application code is:

  • Mapping the path /wp-content/themes/  to the /themes directory in the root of the cloned repository. For new themes to load on the local environment, they must be added to the /themes directory of the cloned repository.
    For local environments that are created as a multisite: Themes will not be listed in a network site’s Themes screen until they are network enabled or enabled per site.
  • Mapping the path /wp-content/plugins/  to the /plugins directory in the root of the cloned repository. For new plugins to load on the local environment, they must be added to the /plugins directory of the cloned repository.
  • Mapping the path /wp-content/mu-plugins/  to the /client-mu-plugins directory in the root of the cloned repository. For a plugin to load on the local environment as a Must Use (MU) plugin, the plugin must be added to the /client-mu-plugins directory of the cloned repository, and loaded programmatically with a plugin-loader.php file.

After a local environment is successfully running with a local clone of application code, a database backup from a VIP Platform environment can be imported to the local environment.

Last updated: December 26, 2023

Relevant to

  • WordPress