2024年6月11日 星期二

ⓒVSCode PHP Live Server


環境建立教學:

1. 下載 PHP

1.1 Mac 版本 - 使用 homebrew 來下載 PHP,請執行語法:


1.2 Windows 版本 - https://windows.php.net/download
本文選擇 VS16 x64 Thread Safe (2024-Jun-04 19:11:24) 的 Zip 版本

2. 安裝擴充套件:
Live Server - https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer
PHP Server - https://marketplace.visualstudio.com/items?itemName=brapifra.phpserver

2.1 點選 VSCode 右下角的 Go Live 將 Live Server 啟動,在 *.php 程式畫面按右鍵,點選 PHP Server: Serve Project 將 PHP Server 啟動。

2.2 如果是 Windows 環境,請將 php.exe 路徑設定到 PHP Server 的 `phpserver.phpPath` 欄位中,或是在系統環境變數 PATH 加入 PHP 根目錄路徑。

3. 安裝 Google Chrome 的擴充功能
Live Server - Web Extension - https://chrome.google.com/webstore/detail/live-server-web-extension/fiegdmejfepffgpnejdinekhfieaogmj/

3.1 打開擴充功能設定,將 Live Reload 打勾以啟用功能。

3.2 在 Actual Server Address 填入


3.3 在 Live Server Address 填入


4. 在瀏覽器中,打開 `http://localhost:3000/` 即可看見即時更新畫面。

後記:
因為老婆公司前端開發需要啟動 PHP 來看到前端開發畫面,
所以找了一下 PHP 要如何在 VSCode 建立簡易的開發環境並作紀錄。

沒有留言: