•   21.05.2024
#Sublime Text

Một số Package Sublime Text cho PHP Developer

1 phút đọc

Sau đây là bài viết tổng hợp một số package Sublime Text cần thiết cho PHP Developer. Để cài đặt được các package thì Sublime text cần phải cài đặt Package Control

I. Cài đặt:

1. Mở command palette:

> Win/Linux: Ctrl+Shift+P
> Mac: Cmd+Shift+P

2. Gõ `Install Package Control`, press enter

II. Packages 

1. Emmet

Emmet là một bộ công cụ của web-developer để hỗ trợ viết code HTML và CSS một cách nhanh chóng. Với Emmet, bạn có thể nhập các biểu thức (chữ viết tắt) giống như CSS selector và chuyển chúng thành đoạn mã chỉ với một lần nhấn phím. Ví dụ, gõ dòng dưới đây vào editor:

ul#nav>li.item$*4>a{Item $}

...sau đó nhấn Ctrl + Space sẽ trở thành :

Tham khảo thêm Emmet cho Sublime Text:

https://github.com/emmetio/sublime-text-plugin#readme

2. All Autocomplete

Mở rộng tính năng autocomplete mặc định, để tìm các từ khóa phù hợp trong tất cả các file.
Bởi mặc định, Sublime chỉ tìm được các keyword có trong file đang mở (current file).

Bạn có thể tùy chỉnh tính năng All Autocomplete do package này cung cấp. Trong menu Sublime, đi tới Preferences > Package Settings > All Autocomplete > Settings – User.

Ví dụ: Thêm cài đặt sau đây để tắt autocomplete khi bạn đang chỉnh sửa code CSS hoặc JavaScript và sẽ không hiện bất kỳ autocomplete nào từ các file Markdown:

"exclude_from_completion": [
    "css",
    "js"
],
"exclude_sources": [
  "markdown"
],
"min_word_size": 5, // không hiển thị autocomplete khi keyword < 5 ký tự
"max_word_size": 40 // không hiển thị autocomplete khi keyword > 40 ký tự

Source: https://packagecontrol.io/packages/All%20Autocomplete

3. SublimeCodeIntel (Code Intelligence)

CodeIntel là một chiếc package thông minh hỗ trợ cho việc hiển thị, gợi ý code, functions, variables, object, string...

Hỗ trợ tất cả các ngôn ngữ mà Komodo Editor hỗ trợ cho Code Intelligence (CIX, CodeIntel2):
JavaScript, Mason, XBL, XUL, RHTML, SCSS, Python, HTML, Ruby, Python3, XML, Sass, XSLT, Django, HTML5, Perl, CSS, Twig, Less, Smarty, Node.js, Tcl, TemplateToolkit, PHP.

Các tính năng của CodeIntel:

* Jump to Symbol Definition - Nhảy tới file hoặc dòng nơi định nghĩa các symbol.
* Imports autocomplete - Hiển thị autocomplete với các modules/symbols được định nghĩa sẵn.
* Function Call tooltips - Hiển thị thông tin trên thanh status bar về các function đang hoạt động.

Source: https://packagecontrol.io/packages/SublimeCodeIntel

4. PHPIntel

Quét và phân tích tất cả code PHP có trong project của bạn.
PHPIntel tạo ra một folder ẩn .phpintel giống như .idea của PHPStorm, và bạn nên include nó vào danh sách .gitignore của dự án.

Source: https://packagecontrol.io/packages/PHPIntel

5. SublimeLinter

Là một linter framework của Sublime Text, giúp cho dev phát hiện lỗi sai syntax, conding convention / style code... Qua đó giúp cho việc coding trở nên nhanh chóng hơn, tập trung quá trình lập trình, các thuật toán, data structures và tính đúng đắn của chương trình hơn thay vì đi tìm những lỗi syntax nhỏ nhặt. Theo Wiki.

Các package linter không được include sẵn, chúng được install riêng theo từng gói. Search các packge theo ngôn ngữ lập trình của bạn ở đây 

Các Linter package cho PHP:
- Sublime​Linter-php
- SublimeLinter-phplint

Tuy nhiên, để các package linter có thể chạy được chúng ta cần add PATH của PHP cho chúng.
Đi tới setting SublimeLinter - User Settings (Preferences -> Package Settings -> SublimeLinter -> Settings - User).
Sau đó, restart lại SublimeText mọi thứ sẽ hoạt động hoàn hảo.

Code setting:

// SublimeLinter Settings - User

{
    "paths": {
        "windows": ["E:\\wamp64\\bin\\php\\php7.3.5"]
    },
    "styles": [
        {
            "scope": "region.yellowish markup.warning.sublime_linter",
            "types": ["warning"]
        },
        {
            "priority": 1,
            "icon": "star",
            "mark_style": "outline",
            "scope": "region.redish markup.error.sublime_linter"
        }
    ],
}

Source: https://packagecontrol.io/packages/SublimeLinter

6. PHPSnippets

Hỗ trợ code nhanh, suggest & autocomplete cú pháp PHP một cách nhanh chóng.
Tuân thủ PSR conding convention.

Tham khảo thêm các keyword trigger ở đây.
Source: https://packagecontrol.io/packages/PHPSnippets

7. Sublime PHP Companion

Giúp import nhanh namespace, classname & nhảy tới file định nghĩa class đó nhanh chóng.

Thêm các phím tắt, có để điều chỉnh theo ý thích:
    Menu Sublime Text > Preferences > Key Bindings

[
  {
    "keys": [
      "f4"
    ],
    "command": "import_namespace"
  },
  {
    "keys": [
      "f5"
    ],
    "command": "find_use"
  },
  {
    "keys": [
      "f6"
    ],
    "command": "expand_fqcn"
  },
  {
    "keys": [
      "shift+f6"
    ],
    "command": "expand_fqcn",
    "args": {
      "leading_separator": true
    }
  },
  {
    "keys": [
      "shift+f12"
    ],
    "command": "goto_definition_scope"
  }
]

Source: https://packagecontrol.io/packages/PHP%20Companion

8. Doc​Blockr & PhpDoc

Hỗ trợ generate nhanh comment cho block code (class, function...).

/** hoặc /* , nhấn Tab để generate comment.

Source: https://packagecontrol.io/packages/DocBlockr

9. Git Gutter

Một package giúp hiển thị thông tin các file đã chỉnh sửa, thêm mới hoặc xoá, thay đổi code bằng các Gutter Icons.

Để install được package GitGutter, thì sẽ không install bằng Package Control nữa, mà sẽ install tay nhé.

a. Đi tới folder chứa package của ST3:
G:\Software\Sublime Text Build 3211 x64\Data\Packages

b. Clone source GitGutter về:

git clone git://github.com/jisaacks/GitGutter.git

c. Mở Sublime-setting lên:

Menu > Preferences > Settings
thêm "mini_diff": false vào bên Preferences.sublime-settings - User

Tham khảo thêm tại link này.
Ý nghĩa của một số symbol, icon Gitgutter:

Cám ơn các bạn đã theo dõi. Nếu có câu hỏi thì comment bên dưới hoặc inbox ngay fanpage, mình sẽ giải đáp nhanh nhất có thể nhé :) 


Hashtags: