- vừa được xem lúc

Sử dụng cú pháp viết tắt trong VS Code

0 0 8

Người đăng: Sang Pham

Theo Viblo Asia

Tạo Snippets trong VS Code

Snippets là một loại mẫu mã nguồn, giúp bạn nhập nhanh các đoạn mã phổ biến mà bạn thường xuyên sử dụng chỉ bằng một từ khoá ( trigger words ). Từ việc tạo ra cấu trúc cơ bản cho một hàm đến việc chèn các đoạn mã mẫu cho ngôn ngữ cụ thể, snippet mang lại sự linh hoạt và tăng tốc độ cho quá trình phát triển phần mềm.

Trong VS Code, có hai loại chính của snippets:

  1. User Snippets: Đây là snippets được tạo và tùy chỉnh bởi người dùng. Bạn có thể tạo các snippets riêng của mình cho ngôn ngữ lập trình cụ thể hoặc ngữ cảnh công việc của bạn.
  2. Extension Snippets: Một số tiện ích mở rộng (extensions) có thể cung cấp các snippets cho công việc cụ thể hoặc ngôn ngữ lập trình. Khi bạn cài đặt một extension, bạn có thể nhận được một bộ snippets đi kèm với nó.

Ở bài viết này mình giới thiệu ‘User Snippets’ trên MacOS, window thì cũng tương tự nhé

Đầu tiên chúng ta vào VS code => cmd+shift+P => Configure User Snippets => New global snippets file => Đặt tên file + Enter.

Dưới đây là một ví dụ:

  1. “logError”: Tên của snippet
  2. “prefix”: định nghĩa từ khoá để mô tả snippet
  3. “body”: Là nội dung, phần code được định nghĩa
  • ${TM_FILENAME_BASE}: tên tệp của tài liệu
  • $1, $2 là vị trí con trỏ chuột. Lúc đầu con trỏ chuột ở $1, nhập thông tin tại $1, sau đó ấn “tab” để chuyển sang $2
  • Ngoài ra, còn nhiều cú pháp:

${1: value}: Vị trí con trỏ chuột tại $1 với giá trị là “value”

${1|one, two, three|}: Vị trí chuột tại $1, với giá trị là 3 lựa chọn “one”, “two”, “three”

Sử dụng các biến có sẵn : ${TM_FILENAME_BASE}, ${WORKSPACE_NAME},..

tham khảo https://code.visualstudio.com/docs/editor/userdefinedsnippets

  • “description”: (optional) dùng để mô tả snippet

Sau khi cấu hình đoạn code sẽ trông như này

Ngoài ra mình có thể sử dụng nhiều snippet trong 1 file:

Hãy cấu hình theo cú pháp của riêng mình. Hy vọng bài viết sẽ giúp ích được cho bạn!

Tài liệu tham khảo : https://code.visualstudio.com/docs/editor/userdefinedsnippets

Bình luận

Bài viết tương tự

- vừa được xem lúc

Gởi Request từ VSCode với Rest Client Extension

Tính năng. .

0 0 37

- vừa được xem lúc

Hướng dẫn debug trực tiếp ứng dụng ReactJS trong VScode

Hướng dẫn debug trực tiếp ứng dụng ReactJS trong VScode. 1.

0 0 23

- vừa được xem lúc

Hướng dẫn thay đổi hình background VSCode theo sở thích - cực đơn giản

Chào mọi người, nếu bạn đang cảm thấy màn hình vscode của mình thật nhạt nhẽo và đơn điệu, bạn cần có sự mới lạ để tăng hứng thú code. Vậy bạn nên xem bài viết này, hôm nay mình sẽ hướng dẫn cho các b

0 0 27

- vừa được xem lúc

30 Mẹo Python Hữu Ích Mà Bạn Nên Lưu Lại Ngay - P1

Python là một ngôn ngữ lập trình không rườm rà. Tính dễ đọc và đơn giản trong thiết kế là hai trong số những lý do chính khiến nó trở nên vô cùng phổ biến.

0 0 14