MacでWordPressの開発環境をVCCWで作る手順

MacでWordPressの開発環境をVirtualBox ＋ Vagrant ＋ VCCWで構築する際の自分用メモ。

VirtualBoxのインストール

「Oracle VM VirtualBox」から最新版をダウンロードしてインストール。

Vagrantをインストール

「Vagrant by HashiCorp」から最新版をダウンロードしてインストール。

vagrant-hottsupdater pluginをインストール

Hostsファイルにホスト名とIPアドレスを追加してくれるプラグイン「vagrant-hostsupdater」をインストール。

「192.168.33.1」を「vccw.dev」などでアクセスできるようにしてくれる。

ターミナルを開いて下記コマンドを実行。

$ vagrant plugin install vagrant-hostsupdater

vagrant boxを導入

作成する仮想マシーンのベースとなるBoxを導入。

$ vagrant box add vccw-team/xenial64

ダウンロードにめっちゃ時間がかかる。残り時間が2時間と表示された…

VCCWをダウンロード

「VCCW – A WordPress development environment.」の「Download.zip」をクリックしてダウンロード。

ダウンロードしたファイルを解凍する。

適当な場所に移動。ホームディレクトリ内に「dev」というフォルダを作成し、その下に移動させた。

~/dev/vccw-x.x.x

複数VCCWを導入することを見越して、ファイル名もわかりやすく変更。「vccw-keikenchi」のように。

設定ファイルを変更

VCCWのフォルダ内にある「provision/default.yml」を一つ上のフォルダに移動させ「site.yml」にリネーム。

「site.yml」を開き「lang: en_US」を「lang: ja」に変更して日本語にする。

vagrantをスタート

リネームしたVCCWのフォルダへ移動。

$ cd ~/dev/vccw-keikenchi

Vagrantをスタートさせる。

$ vagrant up

途中1度だけパスワードを聞かれるので、Macのユーザパスワードを入力する。

最初は構築に10分〜20分とかなり時間がかかるのでのんびり待つ。

と思ったら、10分もしないで終わった。以前より速くなっている。

終わったら「http://vccw.dev」か「http://192.168.33.10」にアクセスしてちゃんと表示されるか確認する。

vagrant をクリックで起動させるようにする

毎回VCCWのフォルダへ移動してvagrant upするのがめんどくさいのでコマンドファイルを作成する。

「vagrant_up.command」というファイルをどこでも良いが、とりあえずわかり易いようにVCCWのフォルダ内に作り下記内容を記述。（vagrant_upの部分は自分がわかり易い名前で良い）

#!/bin/bash
cd ~/dev/vccw-keikenchi
vagrant up

cdの部分は自分のVCCWがある場所を書く。

これでコマンドファイルをダブルクリックして開けば自動でVagrantが起動する。

WordMoveで本番環境と同じ状態にする

VCCWのフォルダ内にある「Movefile」を編集。

VCCW3になったからか、他のサイトで紹介されている「staging」項目がなくなり「production」になっていて混乱。何が違うのか調べてもよくわからない。

加えてssh接続でキーファイルをどこで指定しているのかわからず、半日潰した。

どうやらMacのキーチーンに保存すれば良いらしく、ターミナルで

$ ssh-add -K キーファイルの場所

を設定してあげればssh接続できた。

本番環境はKUSANAGIを使っているので、設定時にダウンロードしたpemファイルを指定すればOK。

$ ssh-add -K ~/xxxx/xxx.pem

ちゃんと通っているかは、vagrant sshで接続したマシン上で


$ ssh-add -l

とすれば、キーファイルが表示され、pemのパスが表示されていれば良い。

「Movefile」内の「production」内を本番環境の内容に変える。

production:
  vhost: "http://example.com"
  wordpress_path: "/var/www/your_site" # wordpressのルートディレクトリを指定

  database: # wp-config.phpのデータベース設定
    name: "database_name"
    user: "user"
    password: "password"
    host: "host"
    port: "3308" # Use just in case you have exotic server config
    mysqldump_options: "--max_allowed_packet=50MB" # Only available if using SSH

  exclude:
    - ".git/"
    - ".gitignore"
    - ".sass-cache/"
    - "bin/"
    - "tmp/*"
    - "Gemfile*"
    - "Movefile"
    - "wp-config.php"
    - "wp-content/*.sql"
    - ".htaccess" # KUSANAGIの設定だと動かなくなるので追加

  ssh:
    host: "host" # httpなしのドメイン。
    user: "user" # ユーザーKUSANAGIの場合はkusanagi
    port: 22
    rsync_options: --verbose

KUSANAGIの「.htaccess」を使うとサーバエラーが出て、管理画面にもログインできなくなるので、Excludeの項目に、「.htaccess」を追加。

sshのhostはhttpなしのドメインだけを書く。このブログの場合は「keikenchi.com」

userはKUSANAGIの場合、「kusanagi」でOK。

ターミナルでVCCWのフォルダへ移動し、

$ cd ~/dev/vccw-keikenchi

vagrant ssh を実行してVagrantへssh接続。

$ vagrant ssh 

Vagrantフォルダへ移動。

$ cd /vagrant

WordMoveを実行して本番環境のデータを丸ごとローカルに移動させる。

$ wordmove pull --all

画像ファイルなど多い場合は数分の時間がかかる。

おわりに

VCCW3が出てしばらくなので、情報が少なくWordMoveのとこでかなり躓きました。

以前より起動が早くなっているのでなかなか快適です。