使用Visual Studio Code搭建PHP調試環境

 1.需要安裝的軟件

    Visual Studio Code、

    WAMP(包括Apache、MySQL、PHP、以及最關鍵的XDebug)

2.下載軟件

     Visual Studio Code，光看名字就知道是微軟的作品，簡單理解就是 一個可以書寫以及調試代碼的編輯器，即Visual Studio的清涼版(競爭對手為Notepad++， Sublime Text)，官網

     

      這里下載的是Windows下的安裝包版本VSCodeSetup-1.8.1.exe

 

      而WAMP是Windows下的PHP開發整合工具包(Linux下為LAMP)，主要集成了Apache、MySQL、PHP和調試用的XDebug, 對於懶人來說是個很好的工具包，安裝包了就可以用了，不用擔心配置Apache和PHP以及，擔心下載到的XDebug與PHP版本不兼容之類的問題

      官網 如下：

   

   點擊Download下載最新的版本，這里下載的是64位的3.0.6版本

3.安裝

     3.1.安裝WAMP，由於最新版需要依賴VC++ 2012和VC++ 2015類庫，如果不安裝就會出現一些錯誤提示：

     

     或者

　　

     下載 VC++2012 和 VC++2015 安裝上就好了

      官網上的截圖：

     

 

        

      安裝的截圖：

　　　

        

      在安裝WAMP的過程中，還會詢問你是否需要修改WAMP所默認的瀏覽器和編輯器，這個自己決定。

            檢查是否WAMP是否安裝成功：

         

          雙擊打開WAMP，會在右下角的任務欄看到它的圖標，如果是綠色代表OK, 其他顏色都有問題，鼠標左鍵點擊就會出現菜單，

         點擊菜單中的Localhost，如果出現以下頁面，代表安裝成功：

        

    

                  3.2.安裝Visual Studio Code,

            雙擊下載到的軟件，一直默認即可

4.配置

         4.1.由於調試的關鍵是XDebug，所以先配置XDebug，打開php.ini配置文件，搜索XDebug

　　　

        可以看到默認的xdebug遠程調用的關閉的，修改如下：

　　  將remote_enable改為on，並增加 xdebug.remote_autostart = on (這一行很重要，不添加可能無法觸發斷點)

xdebug.remote_enable = on
xdebug.remote_autostart = on

　　  由於xdebug默認的運行時間是120秒，超過120秒會自動停止，所以可以根據需求修改 max_execution_time

max_execution_time = 120

 

         4.2. 配置Visual Studio Code,

          由於Visual Studio Code執行php代碼，需要指定php的路徑，不然會出現如下提示，

　　

       所以設置如下：文件->首選項->用戶設置

       

         發現設置文件是個json格式的文件，叫settings.json, 搜索php. 

      

          選中第二項，"php.validate.executablePath":null, 會出現個小筆，點擊一下，在點擊復制到設置，就會在右邊的文件里出現

     

      然后將php.exe的路徑復制進去即可，特別注意，這里的路徑分隔符是反斜杠：

      

      最終配置內容如下：

      

       ctrl + S保存即可

 

        　　4.3.安裝php debug插件，切換到擴展(Extension)界面，拉動滾動條，選擇PHP Debug，點擊安裝，成功后點擊重新載入

       

       重新載入，即重啟Visual Studio Code

　　 

　　　　如果切換到擴展沒有出現插件列表，可以如此操作：點擊右上角的省略號，然后選擇顯示常用的擴展

　　

        特別說明，PHP Debug必須通過打開文件夾中的文件才能調試，直接在VSC中新建的文件是調試不了的：

　　  

        這里有說到，要打開文件夾以啟動調試

          　　

　　　　　　4.4. 配置PHP Debug

           這里說明一下，WAMP的默認工作目錄，在其安裝目錄的www文件夾，平時只需要在里面創建php文件，就能

　　　　通過在瀏覽器中輸入 localhost/xxx.php來訪問，所以這里就直接打開www文件夾，並在其中創建一個hello.php文件

　　　　

           hello.php的代碼如下：只有一句，就是輸出 Hello World!

<?php
    echo 'Hello World!';
?>

　　　　切換到調試Debug界面，首先設置成PHP語言環境

     

          然后選擇Listen for XDebug，這里就是一開始修改php.ini文件的原因，只有開啟XDebug遠程調試，這里才能識別到

         

             在代碼中打一個斷點，然后按下 F5啟動調試工具(不是運行php文件)；

             最后在瀏覽器中輸入hello.php的訪問路徑，然后就可以看到剛剛設置的斷點並命中了

            

 

     =================================================================

 5.總結

         首先要安裝php的開發環境包括xDebug(這里推薦WAMP，傻瓜式，哈哈), 然后安裝Visual Studo Code;

　　　通過修改php.ini來啟動xDebug的遠程調試，以便讓PHP debug 檢測到；

　　　配置Visual Studio Code中php.exe的路徑;

　　   安裝PHP Debug, 並配置好；

　　　通過打開www文件夾，設置好斷點，並通過F5啟動debug環境；

　　　最后在流量器中訪問需要調試的php文件。