Mục lục:
Truy cập thiết lập snippet trong VSCode:Các thành phần của snippet:Ví dụ:Tài liệu tham khảo:Chia sẻ một số snippet mà mình hay dùng cho ReactJS, Typescript:
Truy cập thiết lập snippet trong VSCode:
Đầu tiên bạn mở VSCode lên, sau đó nhấn tổ hợp phím
Ctrl + Shift + P , một hộp thoại như thế này sẽ được mở ra.
Nhập từ khoá snippet vào ô tìm kiếm, sau đó click vào Snippets: Configure User Snippets:
Ở đây có rất nhiều tuỳ chọn ngôn ngữ để bạn tạo snippet cho riêng một ngôn ngữ đó, để cho nhanh thì mình sẽ chọn New Global Snippets file… , sau đó đặt tên file theo ý bạn muốn nhé.
Sau khi đặt tên xong thì chúng ta được một file snippet trống:
Các thành phần của snippet:
- scope: phần này bạn sẽ khai báo những ngôn ngữ nào được sử dụng snippet này.
- body: phần nội dung của snippet, phần này bạn có thể đặt biến cho nó, ví dụ như
$1,$2để đánh dấu vị trí con trỏ chuột, ví dụ sau khi nhập xong code ở$1thì bạn nhấn phím Tab, con trỏ sẽ được chuyển sang$2.
- prefix: Từ khoá của snippet, khi bạn gõ từ khoá này, vscode sẽ tự động điền phần body.
- description: Diễn giải cho snippet, để khi đọc lại có thể biết snippet này dùng cho việc gì.
Ví dụ:
Ở đây mình có 1 snippet của câu lệnh rất quen thuộc của Javascript, đó là console.log:
Dưới đây là demo lệnh snippet này khi sử dụng thực tế:
Tài liệu tham khảo:
Mình có tham khảo qua bài viết của anh
@thaycacac trên Viblo:
Còn đây là link tài liệu chính thức của Visual Studio Code: