จะเพิ่มข้อมูลโค้ดที่กำหนดเองใน VSCode ได้อย่างไร?

เป็นไปได้ไหมที่จะเพิ่มข้อมูลโค้ดที่กำหนดเองใน Visual Studio Code และถ้าเป็นเช่นนั้นอย่างไร? VSCode ขึ้นอยู่กับ Atom ดังนั้นจึงควรเป็นไปได้

1. กด> shift+ command+ pแล้วพิมพ์ข้อมูลโค้ด
2. เลือกPreferences: เปิด User Snippets
3. เลือกประเภทภาษาที่คุณต้องการเพิ่มข้อมูลโค้ดที่กำหนดเอง
4. vscode มีความคิดเห็นที่จะอธิบายเกี่ยวกับวิธีการเพิ่มข้อมูลโค้ดดังที่อธิบายไว้ใน:> vsdoc

สมมติว่าเราต้องการเปิดตัวอย่างข้อมูลที่กำหนดเองสำหรับภาษา GO จากนั้นเราสามารถทำได้:

1. ตี> command+p
2. พิมพ์: go.json + enterและคุณเข้าสู่หน้าตัวอย่างข้อมูลที่กำหนดเอง

ตัวอย่างข้อมูลถูกกำหนดในรูปแบบ JSON และจัดเก็บในไฟล์. json ต่อผู้ใช้ (languageId) ตัวอย่างเช่นข้อมูลโค้ด Markdown จะอยู่ในไฟล์ markdown.json

อัปเดตเครื่องมือใหม่:
ไซต์ตัวสร้าง Snippet: https://snippet-generator.app/

ตัวเลือก - 1 มีปลั๊กอิน VsCode ที่เรียกว่า: snippet creator ..

หลังจากติดตั้งแล้วสิ่งที่คุณต้องทำคือ:

1. เลือกรหัสที่คุณต้องการให้เป็นข้อมูลโค้ด
2. คลิกขวาที่ไฟล์แล้วเลือก "Command Palette" (หรือCtrl+ Shift+ P)
3. เขียน "Create Snippet"
4. เลือกประเภทของไฟล์ที่จำเป็นในการรับชมเพื่อเรียกใช้ทางลัดตัวอย่างของคุณ
5. เลือกทางลัดตัวอย่าง
6. เลือกชื่อตัวอย่างข้อมูล

ตัวเลือก - 2 ตรวจสอบเว็บไซต์นี้ คุณสามารถสร้างตัวอย่างสำหรับ vs code, sublime text และ atom

เมื่อมีการสร้างตัวอย่างข้อมูลในไซต์นี้ ไปที่ไฟล์ข้อมูลโค้ดของ IDE ตามลำดับและวางไฟล์เดียวกัน ตัวอย่างเช่นสำหรับข้อมูลโค้ด JS ในโค้ด VS ไปที่ File-> Preferences-> user snippet จากนั้นจะเปิดไฟล์ javascript.json จากนั้นวางโค้ด snippet จากไซต์ด้านบนลงในนี้และเราก็พร้อมที่จะไป

ในเวอร์ชัน 0.10.6คุณสามารถเพิ่มตัวอย่างข้อมูลที่กำหนดเองได้ อ่านเอกสารในการสร้างตัวอย่างของคุณเอง คุณสามารถค้นหา / สร้างตัวอย่างที่กำหนดเองโดยการวางไฟล์ JSON C:\Users\<yourUserName>\AppData\Roaming\Code\User\snippetsใน ตัวอย่างเช่นตัวอย่างข้อมูลจาวาสคริปต์ที่กำหนดเองจะอยู่ในรูปแบบ\snippets\javascript.json

นอกจากนี้คุณยังสามารถเผยแพร่ตัวอย่างของคุณซึ่งเป็นคุณสมบัติที่ประณีตได้เช่นกัน จอห์นพ่อสร้าง + เชิงมุมดี typescript snippet คุณสามารถดาวน์โหลดเป็นส่วนขยายในตลาด

นี่คือตัวอย่างข้อมูลโค้ดที่ใช้สำหรับเอกสารเกี่ยวกับจาวาสคริปต์สำหรับลูป:

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

ที่ไหน

• For Loop คือชื่อตัวอย่างข้อมูล
• prefixกำหนดคำนำหน้าที่ใช้ในรายการแบบเลื่อนลง IntelliSense ในกรณีนี้สำหรับ.
• bodyคือเนื้อหาตัวอย่าง ตัวแปรที่เป็นไปได้ ได้แก่
  • $ 1, $ 2 สำหรับการหยุดแท็บ
  • $ {id} และ $ {id: label} และ $ {1: label} สำหรับตัวแปร
  • มีการเชื่อมต่อตัวแปรที่มี id เดียวกัน
• description คือคำอธิบายที่ใช้ในเมนูแบบเลื่อนลง IntelliSense

คุณสามารถดูวิดีโอนี้เพื่อดูบทแนะนำสั้น ๆ อย่างรวดเร็ว

https://youtu.be/g1ouTcFxQSU

ไปที่File -> Preferences -> ตัวอย่างผู้ใช้ เลือกภาษาที่คุณต้องการ
ตอนนี้พิมพ์รหัสต่อไปนี้เพื่อสร้างข้อมูลโค้ดสำหรับลูป:

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

คุณทำเสร็จแล้ว
พิมพ์ "for" ในตัวแก้ไขและใช้การคาดคะเนแรก

ทางลัด -

1. ติดตั้งส่วนขยายSnippet-creator
   
2. เน้นรหัสที่คุณต้องใช้ในการสร้างตัวอย่างข้อมูล
   
3. กดctrl+ shift+ Pแล้วพิมพ์ "Create snippet" บนจานคำสั่งแล้วกด ENTER
   
4. เลือกภาษาที่คุณต้องการสร้างตัวอย่างข้อมูล (เช่น -CPP) จากนั้นพิมพ์
   ชื่อข้อมูลโค้ดพิมพ์ทางลัดตัวอย่างข้อมูลจากนั้นพิมพ์คำอธิบายตัวอย่างข้อมูล
   ตอนนี้คุณพร้อมที่จะไปแล้ว
   พิมพ์ช็อตคัทข้อมูลโค้ดในตัวแก้ไขที่คุณป้อนในขั้นตอนที่ 4 และเลือกการ
   คาดการณ์ (หากไม่มีการคาดการณ์ให้กด ctrl + เว้นวรรค) ที่มาก่อน
   

หวังว่านี่จะช่วยได้ :)

หมายเหตุ: goto File-> Preferences-> User Snippets จากนั้นเลือกภาษาที่คุณใช้
สร้างตัวอย่างข้อมูล คุณจะพบตัวอย่างข้อมูลที่นั่น

มีปลั๊กอิน VsCode ที่เรียกว่า: snippet creator ..

หลังจากติดตั้งแล้วสิ่งที่คุณต้องทำคือ:

1. เลือกรหัสที่คุณต้องการให้เป็นข้อมูลโค้ด
2. คลิกขวาที่ไฟล์แล้วเลือก "Command Palette" (หรือCtrl+ Shift+ P)
3. เขียน "Create Snippet"
4. เลือกประเภทของไฟล์ที่จำเป็นในการรับชมเพื่อเรียกใช้ทางลัดตัวอย่างของคุณ
5. เลือกทางลัดตัวอย่าง
6. เลือกชื่อตัวอย่างข้อมูล

นั่นคือทั้งหมด ..

หมายเหตุ: หากคุณต้องการแก้ไขตัวอย่างข้อมูลคุณจะพบได้ใน [fileType] .json
ตัวอย่าง: Ctrl+ Pจากนั้นเลือก "javascript.json"

File --> Preferences --> User Snippetsคุณสามารถเพิ่มสคริปต์ที่กำหนดเองให้ไปที่ เลือกภาษาที่คุณต้องการ

หากคุณเลือก Javascript คุณจะเห็นสคริปต์ที่กำหนดเองเริ่มต้นสำหรับconsole.log(' ');สิ่งนี้:

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

ฉันพยายามเพิ่ม snippets ใน javascriptreact.json แต่มันไม่ได้ผลสำหรับฉัน

ฉันลองเพิ่มตัวอย่างข้อมูลลงในขอบเขตทั่วโลกแล้วมันก็ใช้งานได้เหมือนมีเสน่ห์

FILE --> Preferences --> User snippets

ที่นี่เลือกNew Global Snippets Fileให้ criptreact.code-snippetsJavas

สำหรับภาษาอื่น ๆ คุณสามารถตั้งชื่อได้เช่น [your_longuage] .code-snippets

นี่เป็นคุณลักษณะที่ไม่มีเอกสาร ณ ตอนนี้ แต่จะพร้อมให้บริการเร็ว ๆ นี้ มีโฟลเดอร์ที่คุณสามารถเพิ่มเข้าไปและโฟลเดอร์เหล่านี้จะปรากฏขึ้น แต่อาจมีการเปลี่ยนแปลง (ไม่มีเอกสารประกอบด้วยเหตุผล)

คำแนะนำที่ดีที่สุดคือเพิ่มสิ่งนี้ลงในไซต์ uservoice และรอจนกว่าจะเสร็จสิ้น แต่มันกำลังจะมา

VSCode แนะนำนี้ในรุ่น 0.5, ดูที่นี่ ไวยากรณ์ของ Snippet เป็นไปตามไวยากรณ์ของข้อมูลโค้ด TextMateและสามารถเขียนใน User Preferences

หากคุณไม่ต้องการจัดการกับการเขียนตัวอย่างของคุณใน JSON ตรวจสอบSnipster ช่วยให้คุณสามารถเขียนข้อมูลโค้ดได้เหมือนกับที่คุณเขียนโค้ดเองโดยไม่ต้องใส่เครื่องหมายอัญประกาศแต่ละบรรทัดอักขระ Escape เพิ่มข้อมูลเมตา ฯลฯ

นอกจากนี้ยังช่วยให้คุณสามารถเขียนครั้งเดียวเผยแพร่ที่ใดก็ได้ คุณจึงสามารถใช้ข้อมูลโค้ดของคุณใน VS Code, Atom และ Sublime รวมถึงตัวแก้ไขเพิ่มเติมได้ในอนาคต ข้อมูลเพิ่มเติมที่นี่

นี่อาจไม่ใช่คำตอบที่แท้จริง (ตามที่บางคนตอบไว้ข้างต้น) แต่หากคุณสนใจที่จะสร้างข้อมูลโค้ดที่กำหนดเองสำหรับบุคคลอื่นคุณสามารถสร้างส่วนขยายโดยใช้ yeoman และ npm (ซึ่งโดยค่าเริ่มต้นจะมาพร้อมกับ NodeJS) หมายเหตุ: นี่เป็นเพียงการสร้างตัวอย่างข้อมูลสำหรับระบบอื่นเท่านั้น แต่ก็เหมาะกับคุณเช่นกัน! ยกเว้นคุณต้องการรหัส JS สำหรับทุกสิ่ง