最近知ったVCCWでローカルのワードプレス開発環境を導入する方法を紹介します。
これまでは、ローカルでワードプレスの開発をする時には、MAMPを使うことが多かったのですが、最近ではVCCWを使った開発環境が使い易いと耳にする機会も増えたので、自分でもどんなものか試してみたいと思いました。
現在のバージョンはV3のようですね。
以前のバージョンは触ってなかったのですが、軽量化されたり、新しい機能が追加されて改善されたりとかで、とてもよくなっているようです。
目次
1.導入前の準備
VCCWを導入するには、いくつか必要なものがありますので、揃えていきます。
VirtualBox
パソコンのローカル環境で仮装環境を構築するためのオープンソースのソフトウェア。リンク先からダウンロード可。
https://www.virtualbox.org/
Vagrant
仮装環境を構築するのに役立つツール。
https://www.vagrantup.com/
vagrant-hostsupdater plugin
面倒なホストの設定を自動で行ってくれるVagrantのプラグイン。オプション
$ vagrant plugin install vagrant-hostsupdater
vagrant box
仮装環境の基本ファイル
$ vagrant box add vccw-team/xenial64
VCCW
VCCWのzipファイルをダウンロード
http://vccw.cc/
gitからコマンドラインでもクローンできるみたいですが、余計なファイルが入ってしまうので,zipファイルをダウンロードする方がおすすめのようです。
2.開発環境の構築
必要なツールが揃ったら、いよいよワードプレスの環境を導入します。
まずはVCCWのフォルダを解凍して、作業するフォルダにコピーします。
テストでは、作業用のフォルダとしてvccwtestというフォルダを作成して、その中に先ほど解凍したvccwというフオルダを置きます。
ターミナルでvccwのフォルダに移動
以下のコマンドを実行すると、ローカルにワードプレスがインストールされます。（少し時間がかかります）
$ vagrant up
初期設定そのままで実行すると、vccw内に新たにwordpressというをフォルダが作成されてます。
ここにワードプレスの関連ファイルがインストールされます。
セットアップが完了すると、以下のいずれかのリンクより、ローカルにインストールされたワードプレスを確認することができます。
管理画面へのログインは、通常のワードプレスと同様にlogin.phpよりアクセスできます。
デフォルトではユーザー、パスワード共に「admin」に設定されています。
http://vccw.dev/
http://192.168.33.10/
3.初期設定カスタマイズ
ワードプレスをインストールした後に、言語の設定やプラグインのインストールなどの作業をしなくてもいいように、いろいろと設定をすることができます。
オリジナルの設定を利用するには、provision/default.ymlファイルをvccwの中にコピペして、site.ymlというファイル名に変更して各種設定を書き込んでいきます。
コマンドラインでは、次のように入れると実行してくれます。
$ cp provision/default.yml site.yml
今回設定してみた項目
ホスト名：vccw.test
言語：日本語
サイトタイトル：Test Site Title
メールアドレス：test@example.com
プラグイン：Contact Form 7,All in One SEO Pack,Show Current Template
# encoding: utf-8
# vim: ft=ruby expandtab shiftwidth=2 tabstop=2
#
# General Settings
#
wp_box: vccw-team/xenial64
#
# Virtual Machine Settings
#
memory: 1024
cpus: 1
#
# Network Settings
#
hostname: vccw.test
ip: 192.168.33.10
#
# WordPress Settings
#
version: latest
lang: ja
title: Test Site Title
multisite: false
rewrite_structure: /archives/%post_id%
#
# WordPress Path
#
wp_siteurl: '' # Path to the WP_SITEURL like "wp"
wp_home: '' # Path to the WP_HOME like "wp"
#
# WordPress User
#
admin_user: admin
admin_pass: admin
admin_email: test@example.com
#
# WordPress Database
#
db_prefix: wp_
db_host: localhost
db_name: wordpress
db_user: wordpress
db_pass: wordpress
#
# WordPress Default Plugins
# Plugin's slug or url to the plugin's slug.
#
plugins: ["contact-form-7","all-in-one-seo-pack","show-current-template"]
#
# WordPress Default Theme
# Theme's slug or url to the theme's .zip.
#
theme: ''
#
# WordPress Options
#
options:
blogdescription: This is a test Blogg
#
# WordPress Multisite Options
#
multisite_options: {}
#
# The values of wp-config.php
#
force_ssl_admin: false
wp_debug: true
savequeries: false
#
# Addtional PHP code in the wp-config.php
#
extra_wp_config: |
// Addtional PHP code in the wp-config.php
// These lines are inserted by VCCW.
// You can place addtional PHP code here!
#
# Theme unit testing
#
theme_unit_test: false
theme_unit_test_uri: https://raw.githubusercontent.com/WPTRT/theme-unit-test/master/themeunittestdata.wordpress.xml
# theme_unit_test_uri: https://raw.githubusercontent.com/jawordpressorg/theme-test-data-ja/master/wordpress-theme-test-date-ja.xml
#
# DB will be reset when provision
#
reset_db_on_provision: true
#
# RubyGems
#
ruby_gems:
- bundler
- wordmove
mailcatcher: true
wp_i18n_tools: true
#
# NPM modules
#
npms: []
#
# composer
#
composers:
- phpunit/phpunit:5.6
- squizlabs/php_codesniffer:*
- wp-coding-standards/wpcs:*
# - phpmd/phpmd:*
# - sebastian/phpcpd:*
# - phploc/phploc:*
# - phing/phing:*
#
# wp-cli package commands
#
wp_cli_packages:
- vccw/wp-cli-scaffold-movefile:@stable
#
# Linked Clone for Vagrant v1.8
#
linked_clone: false
#
# Advanced Settings
#
#
# PHP ini values
#
php_ini:
date.timezone: UTC
default_charset: UTF-8
mbstring.language: neutral
mbstring.internal_encoding: UTF-8
post_max_size: 1024M # Same with VVV
short_open_tag: Off
session.save_path: /tmp
upload_max_filesize: 1024M # Same with VVV
xdebug.remote_enable: true
xdebug.remote_host: 127.0.0.1
xdebug.remote_port: 9000
xdebug.profiler_enable: true
xdebug.idekey: VCCWDEBUG
xdebug.remote_connect_back: true
xdebug.remote_autostart: true
synced_folder: ../src
document_root: /var/www/html
すでに、開発環境を導入した後に設定ファイルに変更を加えた後の場合には、vagrant upではなく、
$ vagrant reload —provision
のコマンドで、新しい設定を更新して適用することができます。
設定をもっと活用してどんどん便利に開発環境を整えていきたいですね。
