Cara Membuat Profil Kod di VSCode

Ini memuatkan hasil kerja yang dilakukan oleh @avanslaars yang merupakan rakan pengajar di egghead.io. Dia berkongsi perkara ini dalam egghead Slack suatu ketika dahulu dan saya tidak pernah membuat sendiri.

Sekarang, saya menyediakan komputer riba baru dan memutuskan untuk mencuba. Mengikuti repo Andy di sini, saya akan memandu anda melalui prosesnya supaya anda dapat mengikuti.

Sebelum kita memulakan, "profil kod" pada dasarnya adalah settings.jsonkonfigurasi yang berbeza . Anda juga dapat menyesuaikan peluasan yang dimuatkan setiap profil kod tetapi itu di luar ruang lingkup artikel ini.

1. Buat code_profilesdirektori

Perkara pertama yang perlu kita lakukan ialah membuat tempat untuk menyimpan "tetapan profil" kita. Ia tidak perlu dipanggil code_profiles, tetapi kita akan menggunakan istilah itu sejak Andy melakukannya dan kedengarannya bagus.

Dia menyimpannya di akar komputernya, jadi kami akan melakukan perkara yang sama:

# From the root of your computer ~/ mkdir code_profiles 

Setelah selesai, cdmasuk ke direktori itu:

cd code_profiles 

2. Buat profil pertama anda

Oleh kerana saya akan menggunakan ini untuk rakaman egghead, saya akan membuat direktori baru yang dipanggil egghead:

# mkdir name-of-profile mkdir egghead 

Kemudian cdke direktori itu:

cd egghead 

3. Tambahkan tetapan anda.json

VSCode mengharapkan datadirektori dengan Usersubdirektori. Di sana, kami akan meletakkan tetapan kami:

# -p will create parent directories as needed mkdir -p data/User 

Setelah dibuat, ubah ke Usersubdirektori baru dan buat settings.jsonfail anda :

# Go into that directory cd data/User # Create your settings file touch settings.json 

Kemudian buka settings.jsonfail anda dan tambahkan tetapan anda. Saya akan menambahkan versi yang diubah suai dari apa yang dimiliki oleh Andy:

{ "editor.tabSize": 2, "editor.quickSuggestions": false, "editor.parameterHints": false, "editor.suggestOnTriggerCharacters": false, "editor.hover": false, "editor.fontSize": 18, "editor.tabCompletion": true, "window.zoomLevel": 1, "workbench.colorTheme": "Night Owl", "editor.cursorBlinking": "solid", "editor.cursorStyle": "line", "editor.minimap.renderCharacters": false, "terminal.integrated.fontSize": 16, "explorer.openEditors.visible": 0 } 

4. Uji profil kod baru anda

Sekarang mari kita pastikan bahawa kita melakukan semuanya dengan betul. Dengan andaian anda sudah menyiapkan VSCode untuk [dilancarkan dari baris arahan] (// code.visualstudio.com/docs/setup/mac#_launching-from-the-command-line, kami dapat melancarkan profil baru kami dengan menjalankan:

# replace CODE_PROFILE_NAME with the profile name used earlier code --user-data-dir ~/code_profiles/CODE_PROFILE_NAME/data 

Dan jika ia berfungsi, anda akan melihat VSCode terbuka dengan tetapan anda:

tangkapan skrin vscode dengan tetapan baru

5. Buat alias untuk profil anda.

Saya tidak tahu tentang anda, tetapi saya tidak perlu ingat code --user-data-dir ...jadi mari ambil nasihat Andy dan buat alias.

Saya menggunakan zshjadi saya akan menambahkan alias ini ke .zshrcfail saya seperti menggunakan kata kunci "mengajar":

# replace CODE_PROFILE_NAME with the profile name used earlier alias teach="code --user-data-dir ~/code_profiles/CODE_PROFILE_NAME/data" 

Sekarang, apabila anda ingin menggunakan profil kod ini, yang perlu anda lakukan ialah ketik:

teach ~/projects/lesson 

Woohoo! Dan itu sahaja.

Terima kasih khas kepada @avanslaars kerana berkongsi perkara ini. Inilah pautan ke code_profilesrepo- nya di mana saya belajar bagaimana melakukan ini.

CATATAN : Sekiranya anda menggunakan VSCode dalam mod Portable, terdapat bug yang diketahui di mana bendera user-data-dirtidak berfungsi pada masa ini (terima kasih khas kepada @myfonj kerana menunjukkannya).

###

Siaran ini pertama kali muncul di DEV.

? Palam Shameless: jika anda ingin melihat lebih banyak kandungan seperti ini, langgan buletin saya: //buttondown.email/jsjoeio