Hướng dẫn vscode php extensions - phần mở rộng vscode php

Visual Studio Code là một trình soạn thảo tuyệt vời cho việc lập trình PHP. Với các tính năng như syntax highlighting, bracket matching, IntelliSense (gợi nhớ code) và bạn có thể thêm nhiều chức năng hơn thông qua các extension được tạo bởi cộng đồng lập trình viên. Trong bài viết này AnhBanIT.com sẽ tổng hợp những Extension hỗ trợ viết PHP trên phần mềm Visual Studio Code.

1. Các Extension hỗ trợ lập trình PHP

Các extension cho PHP thì có rất nhiều những dưới đây là những Extension khuyến nghị nên sử dụng:

  • PHP IntelliSense: Gợi nhớ code (Suggest), Tự động hoàn thành code (Auto completion): Gợi nhớ code (Suggest), Tự động hoàn thành code (Auto completion)
  • Code Runner: Chạy PHP Script: Chạy PHP Script
  • PHP Debug: Dành cho việc debug ứng dụng PHP, script PHP: Dành cho việc debug ứng dụng PHP, script PHP
  • HTML CSS Support: Hỗ trợ viết mã HTML/CSS: Hỗ trợ viết mã HTML/CSS

Để cài đặt các bạn bấm tổ hợp phím [ Ctrl + Shift + X] hoặc bấm vào biểu tượng Extension trên VS Code, tìm kiếm extension cần thiết và bấm [ Install ] để cài đặt.

Hướng dẫn vscode php extensions - phần mở rộng vscode php

Cấu hình cơ bản

Để lập trình PHP cần chỉnh sửa một số setting cơ bản cho VS Code như sau:

Từ cửa sổ của Visual Code -> [ File ] -> [ Preferences ] -> [ Settings ] (Hoặc sử dụng tổ hợp phím [ Ctrl +,]) để mở User Settings.File ] -> [ Preferences ] -> [ Settings ] (Hoặc sử dụng tổ hợp phím [ Ctrl +,]) để mở User Settings.

Ở cửa sổ [ User Settings ] thêm hoặc chỉnh sửa các thông tin sau đây:User Settings ] thêm hoặc chỉnh sửa các thông tin sau đây:

Hướng dẫn vscode php extensions - phần mở rộng vscode php

  • php.suggest.basic: false -> Vô hiệu quả chức năng nhắc code có sẵn của VS Code, để chỉ sử dụng chức năng của Extension, tránh bị dupplicate kết quả khi gõ code trên Editor. -> Vô hiệu quả chức năng nhắc code có sẵn của VS Code, để chỉ sử dụng chức năng của Extension, tránh bị dupplicate kết quả khi gõ code trên Editor.
  • php.validate.enable: true -> Sử dụng chức năng validate source code (Sử dụng php linter) -> Sử dụng chức năng validate source code (Sử dụng php linter)
  • php.validate.executablePath -> Đường dẫn tới file thưc thi PHP, cho tác vụ validate -> Đường dẫn tới file thưc thi PHP, cho tác vụ validate
  • php.validate.run: “onSave” -> Thực hiện validate khi save file: “onSave” -> Thực hiện validate khi save file
  • php.executablePath -> Đường dẫn tới file thực thi PHP, cho tác vụ run, debug,… -> Đường dẫn tới file thực thi PHP, cho tác vụ run, debug,…

Hướng dẫn cơ bản sử dụng Visual Studio Code lập trình PHP

PHP IntelliSense

Đây là extension gợi nhớ code, tự động hoàn thành code

Bấm tổ hợp phím [ Ctrl + Space] để sử Editor xổ các function php.

Hướng dẫn vscode php extensions - phần mở rộng vscode php

Code Runner

Là extension chạy PHP Script

Kích chuột phải vào script bạn muốn chạy -> Chọn [ Run code ]

Hướng dẫn vscode php extensions - phần mở rộng vscode php

Kết quả ta có như bên dưới.

Hướng dẫn vscode php extensions - phần mở rộng vscode php

Nhảy tới PHP function đã định nghĩa

Kích chuột phải vào tên function -> [ Go to Definition ] hoặc bấm phím F12Go to Definition ] hoặc bấm phím F12

Hướng dẫn vscode php extensions - phần mở rộng vscode php

Hướng dẫn debug PHP với Visual Studio Code

VS code hỗ trợ debug PHP sử dụng PHP Xdebug. Vì vậy để sử dụng tính năng này, các bạn bắt buộc phải cài đặt Xdebug.debug PHP sử dụng PHP Xdebug. Vì vậy để sử dụng tính năng này, các bạn bắt buộc phải cài đặt Xdebug.

Cấu hình Xdebug

Sửa file php.ini và thêm các config sau:

zend_extension=xdebug.so

[XDebug]
xdebug.remote_enable = 1
xdebug.remote_autostart = 1

Khởi tạo file debug config

Từ cửa sổ của VS Code -> [ Debug ] -> [ Start Debugging ] -> Chọn môi trường debug là [ PHP ]Debug ] -> [ Start Debugging ] -> Chọn môi trường debug là [ PHP ]

Hướng dẫn vscode php extensions - phần mở rộng vscode php

Nó sẽ tạo ra file debug config .vscode/launch.json có nội dung như bên dưới.

{
    // Use IntelliSense to learn about possible attributes.
    // Hover to view descriptions of existing attributes.
    // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
    "version": "0.2.0",
    "configurations": [
        {
            "name": "Listen for XDebug",
            "type": "php",
            "request": "launch",
            "port": 9000
        },
        {
            "name": "Launch currently open script",
            "type": "php",
            "request": "launch",
            "program": "${file}",
            "cwd": "${fileDirname}",
            "port": 9000
        }
    ]
}

Debug 1 script PHP

Mở script PHP mà bạn muốn debug, thực hiện theo thứ tự sau:

  1. Tạo các điểm Breakpoints ở các vị trí code muốn debug
  2. Kích vào biểu tượng debug để vào khu vực debug
  3. Chọn loại debug là “Lauch currently open script“Lauch currently open script
  4. Bấm vào mũi tên màu xanh để thực hiện debug.

Hướng dẫn vscode php extensions - phần mở rộng vscode php

Kết quả ta được như sau:

Hướng dẫn vscode php extensions - phần mở rộng vscode php

Debug ứng dụng PHP (Listen Xdebug)

Để debug ứng dụng web PHP, thì các bạn thực hiện các bước sau:

  1. Tạo các điểm Breakpoints ở các vị trí code muốn debug
  2. Kích vào biểu tượng debug để vào khu vực debug
  3. Chọn loại debug là “Lauch currently open script“Listen For XDebug
  4. Bấm vào mũi tên màu xanh để thực hiện debug.
  5. Kết quả ta được như sau:

Hướng dẫn vscode php extensions - phần mở rộng vscode php

Debug ứng dụng PHP (Listen Xdebug)

Để debug ứng dụng web PHP, thì các bạn thực hiện các bước sau:

Hướng dẫn vscode php extensions - phần mở rộng vscode php

Hướng dẫn vscode php extensions - phần mở rộng vscode php
Chọn loại debug là “Listen For XDebug“