Làm cách nào để thêm các đoạn mã tùy chỉnh trong VSCode?

98

Có thể thêm các đoạn mã tùy chỉnh trong Visual Studio Code không? Và nếu vậy, làm thế nào? VSCode dựa trên Atom, vì vậy nó sẽ khả thi.

code-snippets  visual-studio-code 
— BeastCode
nguồn
2
bạn cũng có thể đi tới Tùy chọn> Đoạn mã người dùng, sau đó chọn ngôn ngữ bạn muốn tạo đoạn mã.
— Amituuush
Có thực sự có mối quan hệ nào giữa VS Code với tư cách là Atom ngoài việc cả hai đều sử dụng Electron dưới mui xe?
— skelliam
Sử dụng dịch vụ codessnippet để làm điều đó. Bạn có thể tạo các đoạn mã tùy chỉnh, chỉnh sửa và đồng bộ hóa với codessnippet cli tất cả các đoạn mã cùng một lúc, chỉ cần lấy từ máy chủ!
— user13428826
Tôi muốn thêm một liên kết trang web trong phần mô tả, có ai biết cách làm không?
— januw

Câu trả lời:

116
  1. Nhấn> shift+ command+ pvà nhập đoạn mã
  2. Chọn Tùy chọn: Mở Đoạn mã Người dùng
  3. Chọn loại ngôn ngữ mà bạn muốn thêm đoạn mã tùy chỉnh
  4. vscode có nhận xét giải thích về cách thêm đoạn mã, như được mô tả trên:> vsdoc

Giả sử, chúng tôi muốn mở các đoạn mã tùy chỉnh cho ngôn ngữ GO. Sau đó, chúng tôi có thể làm:

  1. Nhấn> command+p
  2. Nhập: go.json + enterVà bạn đến trang đoạn mã tùy chỉnh

Đoạn mã được xác định ở định dạng JSON và được lưu trữ trong tệp .json cho mỗi người dùng (languageId). Ví dụ: đoạn mã Markdown đi trong tệp markdown.json.

Cập nhật các công cụ mới:
Trang web trình tạo đoạn mã: https://snippet-generator.app/

— Chandan Nayak
nguồn
3
trình tạo đoạn mã rất hữu ích
— rainversion_3
66

tùy chọn - 1 Có một Plugin VsCode được gọi là: trình tạo đoạn mã ..

Sau khi cài đặt nó, tất cả những gì bạn phải làm là:

  1. Chọn mã mà bạn muốn đặt nó thành đoạn mã.
  2. Nhấp chuột phải vào nó và chọn "Command Palette" (hoặc Ctrl+ Shift+ P).
  3. Viết "Tạo đoạn mã".
  4. Chọn loại tệp cần được xem để kích hoạt lối tắt đoạn mã của bạn.
  5. Chọn một lối tắt đoạn mã.
  6. Chọn một tên đoạn mã.

tùy chọn - 2 kiểm tra trang web này . bạn có thể tạo đoạn mã so với mã, văn bản siêu phàm và nguyên tử.

Sau khi đoạn mã được tạo trong trang web này. Chuyển đến tệp đoạn mã của IDE tương ứng và dán vào. Ví dụ: đối với một đoạn mã JS trong mã VS, hãy chuyển đến Tệp-> tùy chọn-> đoạn mã người dùng, sau đó nó mở tệp javascript.json rồi dán đoạn mã từ trang web bên trên vào bên trong và chúng ta đã sẵn sàng.

— Pranay Kumar
nguồn
8
Đây là một công cụ tuyệt vời! Tôi không thể viết ra một đoạn mã soạn sẵn html tùy chỉnh phải trích dẫn và thoát từng dòng, vì vậy đây thực sự là câu trả lời mà tôi đang tìm kiếm.
— nabrown
3
Nghiêm túc, cứu cánh ở đây.
— JeremyW
Wow đây là một công cụ tuyệt vời hoạt động hoàn hảo. Nên được đánh dấu câu trả lời đúng
— StefanBob
Liên kết Trình tạo đoạn mã bị hỏng. Vui lòng theo liên kết này: snippet-generator.app
— Sandip Subedi
1
tại sao bạn lại viết bước 1 và bước 2? cái này giống như option1 và option2 hơn, hay chúng có liên quan với nhau?
— Xsmael
26

Kể từ phiên bản 0.10.6, bạn có thể thêm các đoạn mã tùy chỉnh. Đọc tài liệu về Tạo đoạn mã của riêng bạn . Bạn có thể tìm / tạo đoạn mã tùy chỉnh bằng cách đặt tệp json vào C:\Users\<yourUserName>\AppData\Roaming\Code\User\snippets. Ví dụ: một đoạn mã javascript tùy chỉnh sẽ nằm trong\snippets\javascript.json

Bạn cũng có thể xuất bản các đoạn trích, đây là một tính năng thực sự gọn gàng. John Papa đã tạo một đoạn mã kiểu chữ + góc cạnh đẹp mắt mà bạn có thể tải xuống dưới dạng tiện ích mở rộng trên thị trường .

Đây là một đoạn mã ví dụ được lấy cho tài liệu về vòng lặp javascript cho:

"For Loop": {
    "prefix": "for",
    "body": [
        "for (var ${index} = 0; ${index} < ${array}.length; ${index}++) {",
        "\tvar ${element} = ${array}[${index}];",
        "\t$0",
        "}"
    ],
    "description": "For Loop"
},

Ở đâu

  • For Loop là tên đoạn mã
  • prefixxác định một tiền tố được sử dụng trong trình đơn IntelliSense thả xuống. Trong trường hợp này cho.
  • bodylà nội dung đoạn trích. Các biến có thể xảy ra là:
    • $ 1, $ 2 cho các điểm dừng tab
    • $ {id} và $ {id: label} và $ {1: label} cho các biến
    • Các biến có cùng id được kết nối.
  • description là mô tả được sử dụng trong trình đơn thả xuống IntelliSense
— Prancer
nguồn
6
Họ thực sự cần một số loại cú pháp theo nghĩa đen của chuỗi nhiều dòng hoặc một cách để kéo phần thân vào một tệp riêng biệt. Trích dẫn và thoát từng dòng một là điên rồ.
— Mark Wilbur,
Xin lỗi vì đã bỏ phiếu xuống cho câu trả lời này, đó là một cú nhấp chuột giả mạo 🙄
— Giles Butler,
16

Bạn có thể xem video này để có hướng dẫn ngắn nhanh

https://youtu.be/g1ouTcFxQSU

Đi tới Tệp -> Tùy chọn -> Đoạn mã người dùng . Chọn ngôn ngữ ưa thích của bạn.
Bây giờ, hãy nhập mã sau để tạo đoạn mã vòng lặp for:

  "Create for loop":{
    "prefix": "for",
    "body":[
      "for(int i = 0; i < 10; i++)",
      "{",
      "   //code goes here",
      "}"
    ],
   "description": "Creates a for loop"
  }

Bạn xong việc rồi.
Nhập "cho" trong trình chỉnh sửa và sử dụng dự đoán đầu tiên.

ĐƯỜNG TẮT--

  1. cài đặt tiện ích mở rộng Snippet-Creator .
  2. Đánh dấu mã mà bạn cần để tạo đoạn mã.
  3. nhấn ctrl+ shift+ Pvà nhập "Tạo đoạn mã" trên bảng lệnh và nhấn ENTER.
  4. chọn ngôn ngữ mà bạn muốn tạo đoạn mã (ví dụ: -CPP), sau đó nhập
    tên đoạn mã, nhập lối tắt đoạn mã và sau đó nhập mô tả đoạn mã.
    Bây giờ bạn đã tốt để đi.
    Nhập lối tắt đoạn mã trong trình chỉnh sửa mà bạn đã nhập ở bước 4 và chọn
    dự đoán (nếu không có dự đoán nào xuất hiện, hãy nhấn ctrl + dấu cách) xuất hiện trước.

Hi vọng điêu nay co ich :)

Lưu ý: goto File-> Preferences-> User Snippets. Sau đó, chọn ngôn ngữ mà bạn
đã tạo đoạn mã. Bạn sẽ tìm thấy đoạn mã ở đó.

— vinod
nguồn
9

Có một Plugin VsCode được gọi là: trình tạo đoạn mã ..

Sau khi cài đặt nó, tất cả những gì bạn phải làm là:

  1. Chọn mã mà bạn muốn đặt nó thành đoạn mã.
  2. Nhấp chuột phải vào nó và chọn "Command Palette" (hoặc Ctrl+ Shift+ P).
  3. Viết "Tạo đoạn mã".
  4. Chọn loại tệp cần được xem để kích hoạt lối tắt đoạn mã của bạn.
  5. Chọn một lối tắt đoạn mã.
  6. Chọn một tên đoạn mã.

Đó là tất cả ..

Lưu ý: nếu bạn muốn chỉnh sửa các đoạn mã của mình, bạn sẽ tìm thấy chúng trong [fileType] .json
Ví dụ: Ctrl+ P, sau đó chọn "javascript.json"

— Peter Shaker
nguồn
5

Bạn có thể thêm các tập lệnh tùy chỉnh, đi tới File --> Preferences --> User Snippets . Chọn ngôn ngữ ưa thích của bạn.

Nếu bạn chọn Javascript, bạn có thể thấy tập lệnh tùy chỉnh mặc định console.log(' ');như sau:

"Print to console": {
    "prefix": "log",
    "body": [
        "console.log('$1');",
        "$2"
    ],
    "description": "Log output to console"
},
— Madhankumar
nguồn
5

Tôi đã thử bằng cách thêm đoạn mã trong javascriptreact.json nhưng nó không hiệu quả với tôi.

Tôi đã thử thêm các đoạn mã vào phạm vi toàn cầu và nó hoạt động như một sự quyến rũ. 

FILE --> Preferences --> User snippets

ở đây chọn New Global Snippets File, đặt tên javas criptreact.code-snippets.

Đối với các ngôn ngữ khác, bạn có thể đặt tên như [your_longuage] .code-snippets

nhập mô tả hình ảnh ở đây

— Lakkanna walikar
nguồn
4

Đây là một tính năng chưa có giấy tờ cho đến nay nhưng sẽ sớm ra mắt. Có một thư mục bạn có thể thêm chúng vào và chúng sẽ xuất hiện, nhưng nó có thể thay đổi (không có tài liệu vì một lý do).

Lời khuyên tốt nhất là thêm cái này vào trang uservoice và đợi cho đến khi nó cuối cùng. Nhưng nó đang đến.

— John Papa
nguồn
0

Nếu bạn không muốn viết các đoạn mã của mình trong JSON, hãy xem Snipster . Nó cho phép bạn viết các đoạn mã như cách bạn viết mã - không phải đặt từng dòng trong dấu ngoặc kép, ký tự thoát, thêm thông tin meta, v.v.

Nó cũng cho phép bạn viết một lần, xuất bản ở mọi nơi . Vì vậy, bạn có thể sử dụng đoạn mã của mình trong VS Code, Atom và Sublime, cùng với nhiều trình chỉnh sửa khác trong tương lai. Thêm thông tin ở đây .

— jhanstra
nguồn
0

Đây có thể không phải là câu trả lời thực sự (như một số đã trả lời ở trên), nhưng nếu bạn quan tâm đến việc tạo các đoạn mã tùy chỉnh cho người khác, bạn có thể tạo tiện ích mở rộng bằng cách sử dụng yeoman và npm (theo mặc định đi kèm với NodeJS). LƯU Ý: Điều này chỉ để tạo đoạn mã cho các hệ thống khác. Nhưng nó cũng làm việc cho bạn! Ngoại trừ bạn cần mã JS cho toàn bộ.

— airax86
nguồn
Khi sử dụng trang web của chúng tôi, bạn xác nhận rằng bạn đã đọc và hiểu Chính sách cookie và Chính sách bảo mật của chúng tôi.
Licensed under cc by-sa 3.0 with attribution required.