sublimetext2でローカルデバッグ

未分類

仮想環境を作成する

作業用エリアを作成し、

mkdir sublimedbug
cd sublimedbug

vagrant box add xdbug https://cloud-images.ubuntu.com/vagrant/trusty/current/trusty-server-cloudimg-i386-vagrant-disk1.box
vagrant init sublimedbug

ホストからブラウザでの接続をできるように
設定ファイルを修正します

vim Vagrantfile
config.vm.network :forwarded_port, guest: 80, host: 8880

仮想環境に入り、php,xdebugをインストール

vagrant ssh
sudo apt-get update
sudo apt-get install php5 libapache2-mod-php5
sudo apt-get install php5-xdebug

ホスト側で、プログラムの編集をできるように
ファイル共有を設定します

mv /var/www/html /vagrant/html
ln -fs /vagrant/html /var/www/html

デバッガーを有効にするために設定を行います

sudo vim /etc/php5/apache2/php.ini

zend_extension="/usr/lib/php5/20121212+lfs/xdebug.so"
xdebug.remote_enable=1
xdebug.remote_handler=dbgp
xdebug.remote_mode=req
xdebug.remote_host=10.0.2.2
xdebug.remote_port=9000
xdebug.idekey = "sublime.xdebug"

サンプルプログラムを作る

vim html/test1.php

<?php echo date("Y/m/d");
for($i;$i<4;$i++){
printf($i."<br>");
printf($i."<br>");
printf($i."<br>");
printf($i."<br>");
printf($i."<br>");
}
?>

アパッチ（Webサービス）を再起動します

sudo service apache2 restart

動作確認を行う

localhost/test1.php

仮想環境を抜け、ホスト側に戻る

exit

sublimetext2を、ホスト側にインストールする

プログラムをダウンロードする

wget　http://c758482.r82.cf2.rackcdn.com/Sublime%20Text%202.0.2%20x64.tar.bz2

解凍する

tar xf Sublime\ Text\ 2.0.1\ x64.tar.bz2

使いやすいように、ファイル名を変えます

sudo mv Sublime\ Text\ 2/ sublime2/

移動する

sudo mv sublime2 /opt/

リンクをつける

sudo ln -s /opt/sublime2 /usr/bin/sublime2

起動

sublime2

コンソールを開く

vew>ShowConsle

コンソールにコピペする

import urllib2,os; pf='Package Control.sublime-package'; ipp = sublime.installed_packages_path(); os.makedirs( ipp ) if not os.path.exists(ipp) else None; urllib2.install_opener( urllib2.build_opener( urllib2.ProxyHandler( ))); open( os.path.join( ipp, pf), 'wb' ).write( urllib2.urlopen( 'http://sublime.wbond.net/' +pf.replace( ' ','%20' )).read()); print( 'Please restart Sublime Text to finish installation')

最下段のコンソールに貼り付ける「Entreｒ」
する
一度、終了して、再度立ち上げる
Ctrl + Shift + p
install package
を、入力し「install package」
を選択する
xdebug
を、入力し「xdebug client」
を選択する

サイドメニューを開く
View>Sidebar>（ShowSideBar)

フォルダーを指定する
Project>OpenFolder フォルダーを指定
　home/(user)/sublimedbug/html/test.php
ファルダーを保存する
Project>SaveProjectAs.. フォルダーを指定
フォルダー属性を変更する
(プロジェクト名).sublime-project

プロジェクト属性を変更します
untitled.sublime-project

{
	"folders":
	[
		{
			"path": "/home/kon/xdb/html"
		},
		{
			"path": "/home/kon/u2"
		}
	],
	"settings":
	{
		"xdebug":
		{
			"close_on_stop": true,
			"ide_key": "sublime.xdebug",
			"path_mapping":
			{
				"/vagrant": "/home/kon/xdb"
			},
			"super_globals": true,
			"url": "http://localhost:8880"
		}
	}
}

ブレークポイントの指定
ctr+fn8

デバッグ（ステップ起動）を実施
ctr+shift+fn9

サンプルページにアクセス

localhost/test1.php

ブレークポイントでの停止を確認
ctr+shift+fn5 次のブレークポイントまで
ctr+shift+fn6　次の行へ
を確認