Analisis ringkas alat VSCode CLI, ternyata sangat berguna!

Bercakap tentang vscode alat CLI, anda mungkin tidak biasa dengannya kerana ia tidak diperlukan dalam kerja harian. Tetapi oleh kerana beberapa fungsinya agak praktikal, dan beberapa idea teknikal saya baru-baru ini hanya boleh direalisasikan dengan bantuannya, artikel ini akan bercakap tentang fungsi praktikal VSCode CLI. [Kajian yang disyorkan: "tutorial pengenalan vscode"]

Arahan shell VSCode CLI dipanggil code dan code akan digunakan kemudian untuk merujuk kepada alat VSCode CLI.

fungsi utiliti kod

Buka sesi terkini

code dilaksanakan tanpa sebarang pilihan atau parameter sesi terkini VSCode. Sebagai contoh, jika anda telah membuka projectA baru-baru ini, tidak kira sama ada projectA dilindungi oleh tetingkap lain atau anda telah keluar dari VSCode, arahan berikut boleh membuka dengan cepat projectA:

$ code

Jika anda Menggunakan shell, arahan ini akan membantu anda membuka VSCode dengan cepat atau mencari fail yang baru anda edit.

Buka projek tertentu

Di sini saya ingin bertanya kepada anda bagaimana anda biasanya menggunakan VSCode untuk membuka projek tertentu Adakah anda mengikuti langkah berikut?

• Klik pada ikon VSCode

• Klik pada bar menu Fail

• Klik pada Buka

• Cari dan buka

  dalam Finder pada Mac. Perintah

adalah yang paling sering saya gunakan. Ia boleh membuka projek dengan cepat dalam direktori semasa dalam VSCode.

Semua projek saya diletakkan dalam direktori tetap, jadi saya hanya perlu code . pergi ke direktori projek dahulu, dan kemudian laksanakan

.

cdSudah tentu anda juga boleh menggunakan kaedah code . untuk membuka projek, kesannya adalah sama.

code <folder>Lompat ke baris dalam fail

Arahan boleh melompat dengan cepat ke aksara tertentu dalam baris fail. Sebagai contoh, arahan berikut akan membuka fail

dan meletakkan kursor pada baris 18, sebelum aksara

ialah 8. code -g <file>:<line>:<character>index.tsindexSesetengah alat dev semasa seperti

react-dev-inspector

$ code -g /project-path/src/index.ts:18:8

dan

vue-devtools membenarkan pembangun mengklik pada elemen DOM untuk membukanya dalam VSCode Dan cari lokasi kod sumber yang sepadan. Prinsipnya adalah untuk mendapatkan maklumat lokasi kod sumber apabila pelayan dev sedang berjalan dan memasukkannya ke dalam elemen DOM Kemudian apabila pembangun mengklik pada DOM, maklumat lokasi dihantar ke pelayan dev, dan pelayan dev kemudian memanggil keupayaan untuk melompat ke kod sumber. codePerbandingan Fail

Jika anda ingin membandingkan dua fail dengan cepat, anda boleh menggunakan arahan berikut:

Pasangan ini digunakan untuk menggunakan VSCode untuk membandingkan fail Ia sepatutnya lebih berguna untuk pelajar yang memahami perbezaan dan menyelesaikan konflik.

$ code -d file-path-a file-path-b

Kendalian pemalam

Ini ialah ciri kegemaran saya yang saya temui baru-baru ini, termasuk perkara berikut:

: dengan

Senarai semua pemalam yang dipasang dalam borang;
• code --list-extensions --show-versions<publisher>.<extensionName>@<version>: Pasang pemalam, anda boleh menambah pilihan
untuk menghalang gesaan pop timbul; pemalam.
• code --install-extension <ext>--forceBayangkan jika anda diminta untuk membangunkan perancah kejuruteraan bahagian hadapan, apakah yang akan anda lakukan?
• Meniru kebanyakan perancah di pasaran, ia sudah tentu akan menyediakan pengguna dengan konfigurasi yang berkaitan dengan format kod seperti editorConfig, eslint, lebih cantik dan sebagainya. Tetapi selepas melengkapkan ini, perancah hanya mendapat 90 mata. Malah, untuk membolehkan eslint berkuat kuasa, pengguna mesti memasang pemalam dan konfigurasi VSCode yang sepadan code --uninstall-extension <ext>.

Nasib baik, anda boleh mencipta

dalam direktori

untuk berkongsi konfigurasi antara ahli pasukan dan menulis ganti konfigurasi setempat, menyelamatkan ahli pasukan masalah konfigurasi manual dan mengelakkan masalah konfigurasi pembangunan yang tidak konsisten . settings.json

Bagi pemalam VSCode, secara amnya, kami membenarkan pengguna memasangnya sendiri atau ia sudah dipasang secara lalai. Tetapi untuk orang baru hadapan atau rakan sekerja baru, ini sudah pasti menyakitkan, dan ia juga tidak boleh diterima oleh pembangun perancah yang sangat baik. Pada masa ini, arahan di atas mula dimainkan.

settings.json.vscode Semak sama ada pengguna telah memasang pemalam Jika tidak, gunakan settings.json untuk memasangnya.

Seperti yang anda boleh bayangkan, dengan bantuan arahan di atas untuk mengendalikan pemalam dan .vscode, perancah boleh membantu pengguna mengkonfigurasi persekitaran pembangunan dengan cara yang tidak mengganggu sepenuhnya, dan boleh memastikan bahawa semua orang dalam pasukan mempunyai konfigurasi yang sama, jadi tidak perlu risau tentang perubahan mendadak Pada suatu hari seorang rakan sekerja baru datang dan mengatakan bahawa eslintnya tidak berkuat kuasa.

Nota: Arahan yang berkaitan dengan operasi pemalam agak berkuasa, jadi gunakannya dengan berhati-hati.

pemasangan kod

Sesetengah pelajar mungkin mengatakan bahawa untuk code berkuat kuasa, anda tidak boleh memasang perintah code secara manual ke dalam pembolehubah persekitaran global PATHNaik?

adalah seperti ini pada Mac, tetapi kami juga boleh memanggil /Applications/Visual Studio Code.app/Contents/Resources/app/bin/code terus melalui laluan code.

Untuk sistem Windows dan Linux, code akan ditambahkan secara automatik pada PATH apabila VSCode dipasang dan code boleh dipanggil terus.

Oleh itu, perancah boleh dikapsulkan untuk menghalang pengguna daripada menambah pembolehubah persekitaran secara manual.

Ringkasan

Artikel ini hanya memperkenalkan beberapa fungsi VSCode CLI yang saya rasa lebih praktikal Fungsi lain seperti menukar bahasa dan pemantauan prestasi tidak diperkenalkan. Anda boleh melompat ke laman web rasmi melalui pautan dalam maklumat di akhir artikel untuk melihatnya.

Baru-baru ini, saya hanya merangkumkan code perintah berkaitan, dengan harapan dapat menyediakan satu set keupayaan asas yang boleh dipanggil terus oleh projek nod lain Alamat projek ialah: github.com/avennn /vsc-…, semua orang dialu-alukan untuk menggunakan dan PR. Jika anda fikir ia bagus, anda dialu-alukan untuk memberikannya bintang.

Untuk pengetahuan lanjut tentang VSCode, sila lawati: tutorial vscode!

Atas ialah kandungan terperinci Analisis ringkas alat VSCode CLI, ternyata sangat berguna!. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!