Format (Làm đẹp) code php trong VS Code

Chào các bạn,

Đây là bài viết tiếp theo của bài Code PHP chuẩn convention với PHP CodeSniffer. Trong bài này, mình sẽ hướng dẫn các bạn auto check lỗi và format code PHP trong Vs Code – một trong những code editor được yêu thích nhất hiện nay.

Lưu ý, để hiểu bài viết này hơn, thì bạn cần đảm bảo các yêu cầu sau:

  • Máy tính đã cài composer ở dạng global.
  • Máy tính đã cài PHP CodeSniffer ở dạng global.
  • Bạn hiểu ý nghĩa của 2 công cụ phpcs và phpcbf.
  • Bạn hiểu ý nghĩa của file cấu hình clix.vn trong dự án.

Nếu không, hãy đọc phần trước của bài viết này, tại đó mình có cung cấp các nội dung hữu ích về các yêu cầu trên.

I. Giới thiệu về tính năng Format Code trong VS Code

Giống như nhiều editor khác, VS Code có tính năng tự động format code của bạn cho chuẩn hơn.

Phím tắt để format code trên VS Code tương ứng với từng hệ điều hành như sau:

  1. Trên Windows: Shift + Alt + F.
  2. Trên Mac: Shift + Option + F.
  3. Trên Linux: Ctrl + Shift + I.

Tuy nhiên, mặc định thì VS Code không tích hợp sẵn việc format code PHP, mà chúng ta phải cài thêm từ extension bên ngoài, và mình sẽ hướng dẫn các bạn cài ở ngay mục phía dưới đây.

II. Format code PHP trong VS Code với PHP Sniffer & Beautifier

Mình đã dùng thử khá nhiều extension format code PHP, thì thấy có thằng PHP Sniffer & Beautifier này là dễ dùng và dễ tùy biến nhất. Để cài đặt extension này, các bạn vào mục Extensions của VS Code, tìm kiếm với từ khóa là “Sniffer & Beautifier” sẽ ra.

XEM THÊM:  Đừng bỏ qua giftcode Ỷ Thiên 3D nếu muốn thành đại hiệp

Chúng ta tiến hành cài đặt bình thường như các extension khác, và sau khi cài đặt xong, thì hãy đi đến phần cài đặt riêng của extension này như hình dưới.

Tại trang cài đặt riêng của extension Sniffer & Beautifier, có 3 thông tin setting quan trọng là Allowed Auto Rulesets, Executable Path CBF và Executable Path CS. Mình sẽ hướng dẫn các bạn các cấu hình các thông tin này sao cho phù hợp ngay sau đây.

2.1 Cấu hình thông tin Allowed Auto Rulesets

Tại mục (1) như trong hình, hãy bấm vào Edit in clix.vn, và đảm bảo ở clix.vnwedAutoRulesets được cấu hình như sau:

Để dễ copy, thì mình viết các value ra đây nhé:

2.2 Cấu hình 2 thông tin Executable Path CBF và Executable Path CS

Tại mục (2) như trong hình, chúng ta cần điền đường dẫn tới 2 công cụ là phpcbf và phpcs. Mình sẽ hướng dẫn các bạn cách lấy thông qua mấy bước đơn giản dưới đây.

Chạy lệnh sau để lấy ra đường dẫn tới thư mục home của composer:

composer config -list -global | grep “home”

Kết quả sẽ có dạng như sau, và phần bôi đậm chính là đường dẫn bạn cần quan tâm.

Lưu ý: mỗi máy sẽ cho ra một kết quả khác nhau, và bên dưới là kết quả trên máy của mình

[home] /Users/admin/.composer

Sau khi có đường dẫn home, thì đường dẫn tới phpcs và phpcbf sẽ có dạng như sau:

# Đường dẫn tới phpcbf /Users/admin/.composer/vendor/bin/phpcbf # Đường dẫn tới phpcs /Users/admin/.composer/vendor/bin/phpcs

XEM THÊM:  Game Xuất Kích

Vậy là chúng ta đã có đường dẫn tới phpcbf và phpcs, giờ chỉ cần điền chúng lần lượt mục Executable Path CBF và Executable Path CS trong trang cài đặt của extension Sniffer & Beautifier là xong.

III. Dùng thử

Khởi tạo một dự án mới với 1 file clix.vn ở thư mục gốc, có rules theo PSR12 như sau:

Tạo tiếp 1 file PHP có sẵn một vài lỗi convention:

Bật dự án lên bằng VS Code, và bạn sẽ thấy nó báo rất nhiều lỗi convention như sau:

Rất nhiều lõi convention được phát hiện

Và để fix hết các lỗi này, bạn chỉ cần Nhấn chuột phải chọn Format document, hoặc sử dụng tổ hợp phím format code như mình hướng dẫn ở đầu bài. Và dưới đây là kết quả sau khi format lại code, bạn sẽ thấy các lỗi convention trên đã được fix.

Các lỗi convention đã được fix.

Công việc tích hợp Sniffer & Beautifier vào VS Code để format code PHP đến đây là kết thúc, chúc các bạn thử nghiệm thành công.

Hẹn gặp lại bạn trong các bài viết tiếp theo.

Trả lời

Email của bạn sẽ không được hiển thị công khai. Các trường bắt buộc được đánh dấu *