ธีม VSCode ที่ดีที่สุดของปี 2019

ธีม Shades of Purple VSCode มีจุดเด่นเป็นธีม VSCode ที่ดีที่สุดของปี 2019

ฉันใช้ Sublime มานานกว่าสิบปีแล้ว แต่เมื่อปีที่แล้วในฐานะนักพัฒนาโอเพ่นซอร์สเต็มเวลาฉันได้รับแรงบันดาลใจจากตัวแก้ไขโอเพนซอร์สใหม่ที่เรียกว่า VSCode หรือ Visual Studio Code

กรอไปข้างหน้าหนึ่งปีและฉันเป็นผู้ใช้ไฟฟ้าตัวยงของ VSCode ฉันตกหลุมรักกับวิธีง่าย ๆ ในการปรับปรุง VSCode และทำให้ดีขึ้นสำหรับทุกคน

ชุมชน VSCode ให้อำนาจฉันมากพอที่จะทำสิ่งต่อไปนี้ซึ่งฉันภูมิใจเป็นพิเศษ:

  • ฉันกำลังช่วยเหลือผู้คนให้กลายเป็นผู้ใช้ไฟฟ้าของ VSCode →
  • ฉันได้รับอุปกรณ์ประกอบฉากเพื่อสนับสนุน VSCode →
  • ฉันได้แบ่งปันเคล็ดลับและเทคนิค VSCode จำนวนหนึ่งไว้แล้ว→
  • ฉันสร้างธีมเงา VSCode →
มาเป็นผู้ใช้ไฟฟ้าของ VSCode!

และใช่นั่นคือสิ่งที่คุณต้องการ ดังนั้นให้อภัยหัวข้อ Clickbaity ของฉันสำหรับปลั๊กที่ไร้ยางอาย - ฉันทำไปแล้ว แต่ได้ทุ่มเททำงานเป็นจำนวนมากเพื่อทำให้ธีมเฉดสีม่วงนี้สมบูรณ์แบบ

เฉดสีม่วงธีม VSCode →

Shades of Purple เป็นชุดรูปแบบ VSCode ที่สร้างขึ้นอย่างมืออาชีพซึ่งฉันสร้างขึ้นโดยการเลือกสีม่วงที่ดูดีและรู้สึกง่ายต่อสายตาของเรา คุณควรจะเฉดสีม่วงเข้มเหล่านี้

รับชุดรูปแบบนี้ได้รับการตรวจสอบโดยนักออกแบบหลายคนและนำไปสู่ ​​~ 70 รุ่นใหม่ของชุดรูปแบบนี้และนักพัฒนาซอฟต์แวร์ 1,017,632+ รายใช้งานทุกวัน

มาดูกันว่าเฉดสีของซินแท็กซ์สีม่วงนั้นดูและรู้สึกอย่างไรอย่างน่าอัศจรรย์ คลิกที่ภาพเพื่อดาวน์โหลดเฉดสีม่วง→

วิดีโอสาธิต & การติดตั้ง

ดูวิดีโอต่อไปนี้บน YouTube เพื่อค้นหาเพิ่มเติมเกี่ยวกับชุดรูปแบบของเฉดสีม่วง เรียนรู้วิธีการติดตั้งและคุณสมบัติเล็กน้อยเกี่ยวกับคุณสมบัติเช่นการแก้ไขมาร์กอัปซึ่งค่อนข้างยอดเยี่ยมสำหรับ SOP

ติดตั้งง่าย

  1. เปิดแถบด้านข้างส่วนขยายใน Visual Studio Code
  2. ค้นหา Shades of Purple Theme
  3. คลิกติดตั้งเพื่อติดตั้ง
  4. คลิกโหลดซ้ำเพื่อโหลดโปรแกรมแก้ไขของคุณ
  5. รหัส / ไฟล์> การตั้งค่า Theme ธีมสี> เฉดสีม่วง

การติดตั้งสำรอง

  1. เรียกใช้เปิดด่วนโดยใช้ Cmd + P - หรือ - Ctrl + P
  2. วางคำสั่งต่อไปติดตั้งเฉดสีของม่วง
  3. คลิกติดตั้งเพื่อติดตั้ง
  4. คลิกโหลดซ้ำเพื่อโหลดโปรแกรมแก้ไขของคุณ
  5. รหัส / ไฟล์> การตั้งค่า Theme ธีมสี> เฉดสีม่วง

การตั้งค่าแบบกำหนดเองที่ดีที่สุด

ชุดรูปแบบนี้ทำงานได้ดีที่สุดด้วยการตั้งค่าต่อไปนี้ โดยเฉพาะอย่างยิ่งถ้าคุณมีตัวอักษรโมโนผู้ประกอบการ เพิ่มไปยังวัตถุ JSON การตั้งค่าผู้ใช้ของคุณ คุณยังสามารถใช้ไอคอน VSCode Shades-of-Purple แบบกำหนดเองที่ฉันสร้างขึ้นตามการทำงานของไอคอน VSCode

// การตั้งค่าธีม
  "workbench.colorTheme": "เฉดสีม่วง",
  "workbench.iconTheme": "vscode-icons",
  "editor.fontFamily": "Operator Mono, Menlo, Monaco, 'Courier New', monospace",
  "terminal.integrated.fontFamily": "'โอเปอเรเตอร์โมโน', 'Inconsolata สำหรับ Powerline', monospace",
  "editor.fontSize": 17,
  "editor.lineHeight": 24.65,
  "editor.letterSpacing": 0.5,
  "editor.fontWeight": "400",
  "editor.fontLigatures": จริง
  "editor.cursorStyle": "line",
  "editor.cursorWidth": 5,
  "editor.cursorBlinking": "solid",
  "editor.renderWhitespace": "all",
  "editor.snippetSuggestions": "top",
  "workbench.startupEditor": "newUntitledFile",
  "editor.glyphMargin": จริง
  "workbench.editor.enablePreview": false,
  "explorer.confirmDragAndDrop": เท็จ
  "files.trimTrailingWhitespace": จริง
  "files.trimFinalNewlines": จริง
  // การจัดรูปแบบเป็นตัวเลือก
  "editor.formatOnSave": จริง
  "prettier.eslintIntegration": จริง
  "eslint.run": "onType",
  "eslint.autoFixOnSave": จริง
  // การตั้งค่า MacOS เท่านั้น
  "workbench.fontAliasing": "อัตโนมัติ",
  "terminal.integrated.macOptionIsMeta": จริง
  "workbench.statusBar.feedback.visible": false,

ฉันกำลังสอนเพิ่มเติมเกี่ยวกับการกำหนดค่าชุดรูปแบบนี้และเครื่องมือแก้ไข Visual Studio Code ของคุณที่ VSCode.pro สนใจ?! ลงทะเบียนเพื่อเป็นผู้ใช้พลังงาน VSCode →

ภาพหน้าจอ:

ไวยากรณ์ของสีม่วงสำหรับ: Markdown

ไวยากรณ์ของสีม่วงสำหรับ: Markdown

ไวยากรณ์ของเฉดสีม่วงสำหรับ: JavaScript

ไวยากรณ์ของเฉดสีม่วงสำหรับ: JavaScript

ไวยากรณ์ของเฉดสีม่วงสำหรับ: PHP

ไวยากรณ์ของเฉดสีม่วงสำหรับ: PHP

ไวยากรณ์สีม่วงสำหรับ: HTML

ไวยากรณ์สีม่วงสำหรับ: HTML

ไวยากรณ์สีม่วงของ: Pug

ไวยากรณ์สีม่วงของ: Pug

ไวยากรณ์ของสีม่วงสำหรับ: Python

ไวยากรณ์ของสีม่วงสำหรับ: Python

ไวยากรณ์ของสีม่วงสำหรับ: Go

ไวยากรณ์ของสีม่วงสำหรับ: Go

ใส่เฉดสีม่วงในที่อื่น!

ฉันได้สร้างธีม Shades of Purple อื่น ๆ สำหรับซอฟต์แวร์ที่แตกต่างกัน

นี่คือรายการ

  • ชุดรูปแบบ VSCode - เฉดสีม่วง
  • ธีม iTerm2 - เฉดสีม่วง
  • ธีม Hyper ™ - เฉดสีม่วง
  • ธีม sole Konsole - เฉดสีม่วง
  • theme ธีมหย่อน - ร่มเงาของสีม่วง
  • theme ชุดรูปแบบอัลเฟรด - เฉดสีม่วง

สวัสดีพวกเราเป็น Dev Dev!

ฉัน (Ahmad Awais) เป็นผู้พัฒนาเว็บเต็มรูปแบบและเป็นผู้สนับสนุนหลักอย่างสม่ำเสมอที่ WordPress คนสำคัญอื่น ๆ ของฉัน (Maedah Batool) เป็นผู้จัดการโครงการด้านเทคนิคและเธอยังเป็นผู้สนับสนุนหลักของ WordPress ร่วมกับทีมงานของเราเราดำเนินการ WPCouple.com

เรียนรู้การเป็น VSCode Power User →

ดังที่ฉันได้กล่าวไว้ก่อนหน้านี้ฉันกำลังช่วยให้ผู้คนได้รับประโยชน์สูงสุดจากประสบการณ์บรรณาธิการของพวกเขา ฉันกำลังทำเช่นนั้นโดยการสร้างหลักสูตรเพื่อให้คุณเป็นผู้ใช้ VSCode Power หลักสูตรมีโดเมนเฉพาะบริบทมากที่สุด VSCode.pro - ดูว่าฉันทำอะไรที่นั่น!

มาเป็นผู้ใช้ไฟฟ้าของ VSCode!

สนับสนุนโครงการโอเพ่นซอร์สของเรา!

หากคุณต้องการให้เราผลิตซอฟต์แวร์ฟรีและโอเพ่นซอร์ส (FOSS) อย่างต่อเนื่อง พิจารณาจ่ายเป็นชั่วโมง dev-time ของฉัน เราจะใช้เวลาสองชั่วโมงในแหล่งข้อมูลโอเพ่นซอร์สสำหรับการบริจาคแต่ละครั้ง ใช่ถูกต้องคุณจ่ายเป็นเวลาหนึ่งชั่วโมงและทำให้พวกเราทั้งคู่ใช้เวลาหนึ่งชั่วโมงเพื่อเป็นการขอบคุณ

ผู้สนับสนุนโครงการ & พันธมิตร TheDevCouple ️

โครงการ FOSS (ซอฟต์แวร์ฟรีและโอเพนซอร์ซ) นี้ได้รับการปรับปรุงและดูแลรักษาด้วยความช่วยเหลือของธุรกิจที่ยอดเยี่ยมที่ระบุไว้ด้านล่าง หากไม่มีการสนับสนุนจาก บริษัท / บุคคลที่น่าทึ่งเหล่านี้โครงการนี้คงเป็นไปไม่ได้ อะไร / อย่างไร อ่านเพิ่มเติมเกี่ยวกับมัน→

ใบอนุญาตและคุณสมบัติ

ได้รับใบอนุญาตในฐานะ MIT ⓒ Ahmad Awais

ขอบคุณทีม VSCode ที่ Microsoft สำหรับการสร้างโปรแกรมแก้ไขโค้ดที่ยอดเยี่ยม นอกจากนี้ยังเป็นผู้สร้างชุดรูปแบบความคมชัดสูงอื่น ๆ ที่ทำหน้าที่เป็นแรงบันดาลใจ ชุดรูปแบบนี้ใช้แรงบันดาลใจจากชุดรูปแบบ VSCode จำนวนมากรวมถึง แต่ไม่ จำกัด เฉพาะชุดรูปแบบโคบอลต์โดย Roberto Achar, Ayu, ชุดรูปแบบ Palenight, ชุดรูปแบบ Dracula, ฯลฯ VSCode และ Icons8 สำหรับไอคอนใน readme นี้

พูดว่าบน Twitter มาเป็นเพื่อนกันที่ @MrAhmadAwais →