Local Setup Quickstart - Vanilla Success

/* * These styles apply ONLY to the header and footer assets. */ * { padding: 0; margin: 0; box-sizing: border-box; } .footer { background: #f5f5f6; color: #555a62; font-size: 14px; line-height: 1.5; padding: 18px 0; } .footer-wrap { padding-left: 18px; padding-right: 18px; max-width: 1236px; margin: 0 auto; } .footer a { color: #0291db; } .footer a:hover { color: #0276b3; } .footer-row { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; margin: -3px; } .footer-col { padding: 0 3px; } .footer-col-copyRight { justify-content: flex-start; } .footer-col-logo { justify-content: flex-end; } .footer-col-copyRight, .footer-col-logo { flex: 1; display: flex; } .logo { width: 120px; height: 28px; opacity: 0.6; } @media screen and (max-width: 768px) { .footer-row { display: block; } .footer-col { width: 100%; text-align: center; margin: 6px 0; } .footer-col:first-child { margin-top: 0; } .footer-col:last-child { margin-bottom: 0; } .footer-col-copyRight, .footer-col-logo { justify-content: center; } .logo { margin: 0 auto; } } /*# sourceMappingURL=styles.css.map */

Vanilla has only 1 supported localhost installation configuration, Vanilla Docker.

Vanilla Docker

Vanilla Docker is a self-container docker-compose setup providing:

PHP
MySQL
Nginx
Memcached
Sphinx
XDebug
Local SSO & Embedding Stubs

Prerequisites

Composer installation

brew install composer
composer self-update --1

Setting up Vanilla Docker

Clone relevant repositories

Create a directory where you will clone all of your vanilla repositories and make sure this directory is shared in the docker desktop settings.

Your user directory is generally shared so this is a good place to put it.

In this guide we will use the directory ~/vnla.

Clone the https://github.com/vanilla/vanilla-docker repository into this directory.
Clone the https://github.com/vanilla/vanilla repository into this directory. It MUST be in the path ~/vnla/vanilla.
- Vanilla employees should clone the https://github.com/vanilla/vanilla-cloud repository instead, but ensure that the the directory it is cloned into is called vanilla.

Important notes

In this scenario the entire contents of the ~/vnla directory will be synchronized into the docker containers. Having an excessive amount of contents here can slow things down so it is recommended that you only put things needed to run vanilla into this directory.

Run the macOS setup script

Run the following setup script.

cd ~/vnla/vanilla-docker
sudo ./mac-setup.sh

Symlink the docker config

cd ~/vnla/vanilla/conf
ln -s ../../vanilla-docker/bootstrap.before.php

Installing Dependencies & Building

The next step is to install composer dependencies & node_modules, then build the frontend.

cd ~/vnla/vanilla
composer install

The first time you run this, it may take a while. Subsequent runs should be faster, but if you are constantly updating the javascript or CSS or addons or themes, it's recommended to use the developer build.

# Add This to you config.php
# $Configuration['HotReload']['Enabled'] = true;

# The run this
yarn build:dev

Starting/Stopping Docker

This is how you will start the docker containers.

cd ~/vnla/vanilla-docker
docker compose up --build -d

To shut down the containers in the future run this:

cd ~/vnla/vanilla-docker
docker compose down

Go to your site.

Navigate to https://dev.vanilla.localhost.
Use the following credentials.

Finish filling out the form.
Submit the form.
See your new site.

Install Cloud Addons

For vanilla employees only.

Run the following:

cd ~/vnla/vanilla
# Symlink cloud addons
./cloud/scripts/symlink-addons
# Install dependencies and rebuild frontend
composer install