Настройка локальной среды разработки WordPress с Vagrant

Если вы разрабатываете с WordPress, предпочтительно настроить локальную среду, где у вас установлен сервер, инструмент базы данных и несколько сайтов WordPress вместе с другими необходимыми инструментами. Это нормально, если вы работаете только над несколькими проектами. Но когда они множатся, возникают проблемы. А также головная боль от поддержки нескольких сред, потому что у клиента другая настройка, чем у вас.

Чтобы обойти эту проблему, мы можем использовать то, что мы называем Vagrant. Vagrant — это инструмент для работы с виртуальными средами. Он предоставляет простой способ настройки локальной среды разработки с помощью нескольких команд, и вы можете воспроизводить полную настройку столько раз, сколько хотите, с легкостью и без хлопот по установке всего вручную. Чтобы запустить Vagrant, вам нужно определить набор правил. Vagrant настраивает вашу виртуальную машину на основе этих правил. Для этого Vagrant нужны два файла: Vagrantfile, который говорит Vagrant, какое оборудование нужна виртуальной машине, и файл развертывания, который говорит Vagrant, что делать на виртуальной машине.

Поскольку Vagrant работает с виртуальными средами, вам нужно программное обеспечение для виртуальных машин, чтобы запустить Vagrant. Для наших целей мы будем использовать Open Source Virtualbox.

Установка VirtualBox

Перейдите на страницу загрузки Virtualbox и загрузите бинарный файл, соответствующий вашей гостевой системе. (Гостевая система — это операционная система, с которой вы будете запускать свою среду разработки.) Установите Virtualbox.

Установка Vagrant

Скачайте бинарный файл, соответствующий вашей операционной системе, со страницы загрузки Vagrant и установите его.

Чтобы проверить, успешно ли он установлен, введите следующую команду в командной строке вашей ОС.

$ vagrant -v

Установка плагина Vagrant Hosts Updater

Плагин vagrant-hostupdater изменит файл hosts вашей ОС, чтобы домены, настроенные Vagrant, работали. Чтобы установить его, выполните следующую команду

$ vagrant plugin install vagrant-hostsupdater

Перезагрузите вашу ОС после установки Vagrant/Virtualbox, чтобы не было проблем с сетью.

Установка Git

Linux

Нам также понадобится система контроля версий Git для этого учебника. Если у вас его нет, установите его, используя следующую команду, если у вас дистрибутив Debian/Ubuntu

$ sudo apt install git

или если у вас Fedora

$ sudo dnf install git

или если у вас CentOS/RHEL

$ sudo yum install git

Проверьте версию установленного Git с помощью следующей команды

$ git --version

Вы увидите что-то вроде

$ git version 2.20.1

Вам нужно настроить Git с помощью следующих команд.

$ git config --global user.name "Ваше Имя"   
$ git config --global user.email "[email protected]"

Windows

Чтобы установить Git на Windows, перейдите на страницу загрузки Git и установите бинарный файл.

Mac OS

Если у вас установлен homebrew, вы можете установить Git с помощью следующей команды.

$ brew install git

или вы можете загрузить бинарный пакет со страницы загрузки Git и установить его.

Установка Varying Vagrant Vagrants

Вместо того чтобы создавать настройку Vagrant с нуля, мы будем использовать Varying Vagrants Vagrant (VVV) — конфигурацию Vagrant с открытым исходным кодом, специально предназначенную для создания сред разработки WordPress. Стандартный VVV настраивает вашу виртуальную машину на базе Ubuntu 18.04 вместе с сервером Nginx, базой данных MariaDB, PHP, WP-CLI, Node.js, MailHog, Composer, memcached, phpMyAdmin, git и различными другими инструментами. VVV предоставит вам несколько установок WordPress по умолчанию, одна из которых является последней версией, чтобы помочь вам экспериментировать.

Первый шаг — клонировать репозиторий Git VVV в локальный каталог на вашей системе.

$ git clone -b master git://github.com/Varying-Vagrant-Vagrants/VVV.git ~/vvv

Здесь мы клонируем основную ветку репозитория на систему. Если вы хотите более быстрые обновления, вы можете использовать ветку develop.

Запуск VVV

Перейдите в каталог, где вы клонировали VVV.

$ cd vvv

Запустите среду Vagrant, которая установит виртуальную машину и настроит все.

$ vagrant up

Этот процесс может занять некоторое время, так что будьте терпеливы. Во время процесса вас могут попросить ввести пароль root, который необходим для настройки файла hosts вашей системы.

Примечание для пользователей Windows 8/10

Если вы на Windows, вы можете получить следующую ошибку

==> default: Booting VM...   
Произошла ошибка при выполнении `VBoxManage`, CLI, используемого Vagrant для управления VirtualBox. Команда и stderr показаны ниже.   
   
Команда: ["startvm", "1fe83aa1-2f23-4ddd-ad77-b7e7e00aabe6", "--type", "headless"]   
   
Stderr: VBoxManage.exe: ошибка: Не удалось открыть/создать внутреннюю сеть 'HostInterfaceNetworking-VirtualBox Host-Only   Ethernet Adapter #3' (VERR_INTNET_FLT_IF_NOT_FOUND).   
VBoxManage.exe: ошибка: Не удалось прикрепить сетевой LUN (VERR_INTNET_FLT_IF_NOT_FOUND)   
VBoxManage.exe: ошибка: Подробности: код E_FAIL (0x80004005), компонент ConsoleWrap, интерфейс IConsole

Обратите внимание на адаптер, упомянутый здесь:

VirtualBox Host-Only Ethernet Adapter #3

Откройте Панель управления >> Центр управления сетями и общим доступом. Теперь нажмите на Изменить параметры адаптера. Щелкните правой кнопкой мыши на адаптере, имя или имя устройства которого совпадает с VirtualBox Host-Only Ethernet Adapter #3 и нажмите на Свойства. Нажмите на кнопку Настроить.

Теперь нажмите на вкладку Драйвер. Нажмите на Обновить драйвер. Выберите Просмотреть мой компьютер для драйверов. Теперь выберите Позвольте мне выбрать из списка доступных драйверов на моем компьютере. Выберите вариант, который вы получите, и нажмите Далее. Нажмите Закрыть, чтобы завершить обновление. Теперь вернитесь в ваш терминал/Powershell/командное окно и повторите команду vagrant up. На этот раз должно все работать.

После завершения вы можете посетить вашу панель VVV по адресу http://vvv.test.

VVV поставляется с двумя стандартными установками WordPress - http://one.wordpress.test и http://two.wordpress.test. Оба сайта имеют одинаковые данные для входа: admin в качестве имени пользователя и password в качестве пароля. Учетные данные базы данных для обоих сайтов: wp в качестве имени пользователя и пароля. Учетные данные пользователя root MySQL: root как имя пользователя и пароль. А учетные данные пользователя root VM: root как имя пользователя и vagrant как пароль.

Существует установка WordPress для разработчиков по адресу http://trunk.wordpress.net, но она не будет работать, так как она не была предоставлена. Эта установка полезна, если вы являетесь участником WordPress, который работает с билетами Trac и патчами. Чтобы включить ее, откройте vvv-custom.yml и измените значение skip_provisioning под wordpress-trunk на false, а затем повторно предоставьте VM, используя команду

$ vagrant reload --provision

Существует еще одна установка WordPress без URL, обозначенная как wordpress-meta-environment. Эта установка создаст среду, полезную для вкладов в команду WordPress meta, например, WordCamps, .org и т. д. Чтобы включить эту установку, добавьте следующую строку под wordpress-meta-environment в файл vvv-custom.yml.

hosts:  
  - wpmeta.test

А затем измените значение skip_provisioning на false и повторно предоставьте VM.

$ vagrant reload --provision

Добавление нового сайта

Если вы хотите добавить еще один сайт в VM, вам нужно будет отредактировать файл vvv-custom.yml, который вы можете найти в каталоге vvv. Если его там нет, просто скопируйте vvv-config.yml и создайте его. Это одноразовый процесс, и вам не нужно будет делать это снова. Всегда вносите изменения в vvv-custom.yml, потому что vvv-config.yml перезаписывается при обновлении VVV.

Добавьте следующий код в раздел сайтов в vvv-custom.yml, чтобы добавить новый сайт.

newsite:
    repo: https://github.com/Varying-Vagrant-Vagrants/custom-site-template
    description: "Установка WordPress с подкаталогом"  
    vm_dir: /srv/www/newsite  
    local_dir: /home/user/vvv/www/newsite  
    branch: master  
    nginx_upstream: php
    skip_provisioning: false
    hosts:
      - newsite.test
    custom:
      wp_type: subdirectory

Переменные

repo variable относится к предопределенному репозиторию Github, который содержит информацию о том, как настроить новый сайт WordPress на VM. На данный момент мы используем репозиторий, поддерживаемый VVV.

description переменная самоочевидна.

vm_dir — это фактический каталог внутри VM, где будет находиться ваш сайт.

local_dir — это каталог на вашем хосте, где находится ваш сайт.

branch переменная говорит Vagrant проверить основную ветку репозитория в данном примере.

nginx_upstream используется для установки, куда Nginx передает запросы, и обычно используется для изменения версии PHP, необходимой для вашей установки. php здесь относится к версии PHP по умолчанию, которая составляет 7.2. Вы можете использовать php71, чтобы изменить ее на PHP 7.1, или php56, чтобы изменить ее на PHP 5.6.

skip_provisioning установлен в false, что означает, что нам нужно включить этот сайт в VM.

hosts переменная используется для установки URL, который нам нужно будет использовать для доступа к сайту.

custom раздел полезен, если вам нужен дополнительный контроль над вашим сайтом WordPress. Вы можете использовать этот раздел для настройки установки мультисайта или установки другой версии WordPress и даже изменения имени базы данных или вашего сайта, который будет использоваться для вашей установки.

wp_type переменная решает, будет ли ваша установка одиночной, мультисайтом с доменами или мультисайтом с подкаталогом. wp_type принимает четыре значения: single, subdomain, subdirectory и none. С установкой поддомена вы можете определить несколько хостов для вашей установки мультисайта в следующем формате

hosts:
    - multisite.test
    - site1.multisite.test
    - site2.multisite.test
  custom:
    wp_type: subdomain

Вы можете добавить еще одну переменную в разделе custom, которая называется wp_version. Вы можете установить ее на nightly, если хотите установить ночную версию WordPress. Она принимает три значения: nightly, latest и номер версии.

custom: 
     wp_version: nightly

Существует еще одна переменная, db_name, которая позволяет вам установить имя базы данных для вашей установки.

custom:
    db_name: super_secet_db_name

И, наконец, site_title переменная позволяет вам установить заголовок вашего WP сайта.

custom:
    site_title: Мой потрясающий сайт разработки

Это должно охватить все переменные и параметры, которые вам понадобятся для добавления вашего собственного сайта в VVV. После изменения файла vvv-custom.yml просто выполните следующую команду, чтобы сделать ваш новый сайт рабочим.

$ vagrant reload --provision

Добавление существующего сайта

До сих пор мы узнали, как добавить совершенно новый сайт в VVV. Но что, если вы уже работаете над сайтом и хотите добавить его под VVV? Давайте посмотрим, как мы можем это сделать.

Чтобы добавить существующий сайт, первый шаг такой же, как и раньше, т.е. редактирование файла vvv-custom.yml и добавление следующего кода.

howtoforge:
    repo: https://github.com/Varying-Vagrant-Vagrants/custom-site-template
    description: "Сайт WordPress"  
    vm_dir: /srv/www/newsite  
    local_dir: /home/user/vvv/www/newsite  
    hosts:
      - howtoforge.local

Это скажет VVV настроить новый сайт, доступный по адресу http://howtoforge.local. Но это совершенно новый сайт. Что нам нужно сделать, так это преобразовать его в нашу существующую установку. Для этого нам нужно скопировать файлы из нашей существующей установки WordPress в локальный каталог, т.е. /home/user/vvv/www/newsite

$ cp /var/www/howtoforge/ /home/user/vvv/www/newsite/

Теперь нам нужно скопировать базу данных. Простой способ сделать это — экспортировать вашу существующую базу данных в файл .sql, скопировать этот файл в каталог нашего блога и импортировать базу данных снова, подключившись по SSH к нашей VM.

Сначала войдите в mysql в командной строке вашей локальной системы и используйте следующую команду для экспорта базы данных.

$ cd /home/user/vvv/www/newsite
$ mysqldump -u username -p database_name > data-dump.sql

Теперь мы можем снова предоставить VM.

$ vagrant reload --provision

SSH в вашу VM.

$ vagrant ssh

Теперь импортируйте базу данных обратно в вашу VM.

$ cd /srv/www/newsite 
$ mysql -u root -p newsite < data-dump.sql

VVV уже создал новую базу данных во время предоставления для нашего блога с именем newsite. Пароль для пользователя root здесь — root. Вышеуказанная команда импортирует нашу существующую базу данных в новую.

Это завершает настройку существующего сайта в VVV.

Включение SSL

Установки localhost обычно не защищены. И установка собственного сертификата на localhost может быть длительным и утомительным процессом, даже с Let’s Encrypt. Но VVV делает этот процесс довольно простым и по умолчанию имеет SSL, включенный на всех ваших установках WordPress. Просто начните использовать https с вашими сайтами. В первый раз ваш браузер будет жаловаться на недействительный сертификат, но добавьте его как исключение, и с этого момента все должно быть в порядке.

Обновление WordPress

Вы можете обновить свою установку WordPress из своей панели управления. Также VVV будет обновлять ваш WordPress всякий раз, когда вы повторно предоставляете VM. Вы также можете обновить WordPress вручную, загрузив его с WordPress.org и распаковав zip-файл. И вы также можете использовать WP CLI, который поставляется с VVV. Чтобы обновить ваш сайт с помощью WP CLI, используйте следующие команды.

$ cd /srv/www/newsite
$ wp core update

Обновление VVV

Первый шаг — остановить машину Vagrant.

$ vagrant halt

Теперь убедитесь, что ваш vagrant и Virtualbox обновлены. Если нет, загрузите их снова и установите.

Выполните следующую команду, чтобы обновить ваш Vagrant box. Это необязательно, но лучше, если вы продолжите это делать.

$ vagrant box update

Теперь получите последнюю версию VVV с Github.

$ git pull

Повторно предоставьте box, чтобы завершить обновление.

$ vagrant up --provision

Дополнительные инструменты

VVV поставляется с различными утилитами, которые вы можете установить. Вы найдете их в разделе утилит в вашем файле vvv-custom.yml. По умолчанию tls-ca и phpmyadmin включены. Вы можете дополнительно установить memcached, opcache, webgrind, mongodb, tideways и версии php от 5.6 до 7.3, убрав # перед ними в разделе утилит.

Вы даже можете добавить свое собственное программное обеспечение, которое хотите установить. Вам нужно будет изменить файл vvv-custom.yml на что-то вроде

utilities:
  core:
    - tls-ca  
    - phpmyadmin
  java:
    - java7
utility-sources:
  java:
    repo: https://github.com/example/java-utilities.git
    branch: master

Вы добавите новый раздел, java, здесь, например. Код для установки будет поступать из git-репозитория. Ваш git-репозиторий должен быть структурирован примерно так

java7/
    provision.sh

Файл provision.sh будет содержать необходимый код для установки java в вашей VM. Имя папки должно совпадать с именем, которое вы использовали выше в файле vvv-custom.yml.

Заключение

На этом наш учебник о том, как настроить локальную среду разработки WordPress с Vagrant, завершен. Дайте нам знать, если у вас есть какие-либо вопросы.