Vagrant+VCCWでWP開発環境を構築～終了まで

長年XAMPPを使っていましたが、最近小難しい案件が増えてきたため、そろそろVagrantを使ってみようと思いました。

取り急ぎWordPressの開発環境がほしいわけで、VCCWを使って開発環境の構築をしてみたところ、いろいろ嵌ったのでメモ。

なお、Windowsしかわからないので、Macでの場合とはちょいちょい違うこともあると思います。

準備からの流れは以下の通り

順に見ていきましょう。

Virtualboxのインストール（初回のみ）

公式サイトから最新版をインストール。僕の場合はOracle VM VirtualBox Base Packages – 5.2.8 (Microsoft Windows Only)をダウンロードし、インストールしました。

いやいやVirtualBoxってなんやねん

Vagrantの前に、実はこのVirtualBoxというやつが大事です。

そもそもVagrantというのは、簡単にいうとサーバーの環境情報を書き込まれたファイルであって、これだけではサーバーとしての機能はありません。

VirtualBoxという仮想マシンを使ってVagrantという設定ファイルを読み込み、仮想サーバーを立ち上げるということになります。

言ってしまえば、VirtualBoxこそがサーバーの本体です。

 

Vagrantのインストール（初回のみ）

公式サイトからWindowの64bit版をダウンロードし、インストール。

 

上記２つは、インストール中も特にオプションとか変更はせず、ストレートにそのままインストールしました。
２つともインストールしたら、PCは再起動したほうがいいらしいので、再起動しました。

 

VCCWのダウンロード

PCの再起動が終わったら、おもむろにコマンドプロンプトを開き、開発環境を構築すると思われるディレクトリに移動。

僕の場合は、”C:\vagrant”というディレクトリを作り、その中で開発環境を構築することに。

C直下まで移動し、vagrantというディレクトリを作る。これくらいであればマウスの右クリックでもできるので、どっちでもいいんですが、黒い画面でできるようになっていたほうが後々便利ですよ。

次に、vagrantのディレクトリに入り、更にsampleというディレクトリを作り、そしてその中に入る。

次は、vccwをgitからダウンロードさせていただく。

うまくいけば、vccwというディレクトリが作成され、その中にいろいろ入っているのが確認できると思います。

今のうちにvccwディレクトリ内に移動しておきましょう。

vagrant-hostsupdaterのインストール（初回のみ）

vagrant-hostsupdaterは、hostsファイルを自動で書き換えてくれるプラグイン。これがあれば、vagrant up したあとにhostnameで設定したURLでブラウザからアクセスできるようになる。ちなみにこれはVagrant本体と同じく、PC１台につき１回インストールすればOK。

初期設定

vagrant upする前に、WordPressインストール時の設定をいじっておきましょう。

site.ymlの編集

provisionディレクトリ内にあるdefault.ymlを、vccwディレクトリ直下に移動し名前をsite.ymlに変更する。コマンドプロンプトなら以下でできる

site.ymlをエディタで開き、設定をちょっといじる。WordPressの初期設定をいろいろいじれるようになっているが、とりあえず重要なのは以下

hostnameは、そこに設定したアドレスでブラウザから確認できるようになる。ここで注意したい点が以下の２つ

ipは、最初は初期設定のままでOKなんですが、環境を複数構築したい場合は、ipが同じだとうまくいかないっぽいので、値を変える必要がありそう。（例：192.168.33.11）

langは言語設定。日本語が良ければ”en_us”→”ja”にしておきましょう。

他にもデバッグモードとかマルチブログモードの設定もできるようになっています。好みに合わせて設定しましょう。

Vagrant 起動

実際にブラウザでsample.testとうってアクセスし、うまく表示されていれば大成功！

念のため管理画面にログインしてみます。

ログインの初期設定は、デフォルトでは（admin/admin）になっているみたいです。本番にアップする際に面倒なので、最初からsite.ymlを編集してちゃんとしたアイパスに設定しておいたほきましょう。

 

Vagrant終了（だいじ）

Vagrantを起動したら、基本的にずっと起動したままになっています。

これだとPCをシャットダウンできない事態に陥るため、作業終了の際は必ずVagrantを終了させてやりましょう。

Vagrantの起動状態を確認

終了させたら、Vagrantが終了したかを確認しときましょう。

poweroffって出てるので止まったみたい。

 

はまった点

vagrant-hostsupdaterをインストールしていなかったため、アクセスできずにややはまり。そしてvccwを１回削除し、同じ名前のディレクトリ、同じIPでもう１回インストールしたら、hostnameは変わったもののWordPressのインストールディレクトリが以前のままになっていて（データベースに記録されているんだろうか…よくわからない）レイアウトが大爆発してはまった。

これを気を付ければスマートにいけると思います。