coretan kod editor atom: Alat penggunaan semula kod yang efisien
Coretan kod adalah blok kod yang boleh diguna semula yang dapat dengan cepat memasukkan fail program dan merupakan fungsi teras editor teks atom. Serpihan yang telah ditetapkan biasanya disediakan dengan pakej atom dan sintaks bahasa.
coretan tersuai boleh dibuat dan ditakrifkan dalam fail ~/.atom
yang terletak di folder snippets.cson
anda. Mereka memerlukan pengenal bahasa, nama, teks pencetus, dan kod badan serpihan (tab pilihan).
coretan boleh digunakan dalam mana -mana bahasa pengaturcaraan yang disokong oleh atom, hanya tentukan skop bahasa yang betul apabila menentukan serpihan. Mereka boleh mengandungi pembolehubah dan boleh digunakan untuk memasukkan blok kod biasa, menjimatkan masa dan memastikan konsistensi kod.
Coretan kod adalah blok kod biasa yang anda boleh memasukkan fail program dengan cepat. Mereka sangat berguna dan juga merupakan ciri utama editor teks atom. Iaitu, anda boleh menggunakan editor selama berbulan -bulan tanpa menyedari kewujudan coretan kod atau mengalami kuasa mereka! Pakej atom dan sintaks bahasa biasanya dilengkapi dengan coretan kod yang telah ditetapkan. Sebagai contoh, mulakan atau buka fail HTML baru, kemudian ketik IMG dan Tekan Tab. Kod berikut akan muncul:
<img src="" alt="" />
akan terletak di antara petikan atribut src
. Tekan kekunci Tab sekali lagi dan kursor akan bergerak ke harta alt
. Tekan kekunci Tab untuk kali terakhir dan kursor akan bergerak ke akhir label. Apabila anda mula menaip, teks pencetus coretan kod ditunjukkan dengan anak panah hijau. Anda boleh melihat semua coretan kod yang ditentukan jenis bahasa fail semasa dengan meletakkan kursor di mana-mana dan menekan alt-shift-s. Tatal atau cari senarai untuk mencari dan menggunakan coretan kod tertentu. Sebagai alternatif, buka senarai pakej dalam tetapan dan masukkan bahasa untuk melihat senarai semua jenis sintaks. Pilih satu dan tatal ke bahagian Coretan Kod untuk melihat pencetus dan kod yang telah ditetapkan.
bagaimana membuat coretan kod anda sendiri
anda akan mempunyai blok kod yang biasa digunakan anda sendiri yang boleh ditakrifkan sebagai coretan kod. Perintah berguna yang saya gunakan ketika menyahpepijat aplikasi Node.js adalah untuk log objek sebagai rentetan JSON ke konsol:
console.log('%j', Object);
Atom sudah mempunyai pencetus log
yang telah ditetapkan untuk console.log()
; Coretan kod tersuai ditakrifkan dalam fail ~/.atom
yang terletak di folder snippets.cson
anda. Pilih buka coretan kod anda dari menu fail untuk mengeditnya. Coretan kod memerlukan maklumat berikut:
pergi ke hujung snippets.cson
, taip snip
dan tekan tab - ya, bahkan ada coretan kod yang dapat membantu anda menentukan coretan kod! ...
<img src="" alt="" />
Perhatikan bahawa CSON adalah notasi objek Coffeescript. Ia adalah sintaks ringkas yang boleh dipetakan terus ke JSON; Pertama, anda memerlukan rentetan pelbagai yang mengenal pasti bahasa di mana coretan kod boleh digunakan. Cara paling mudah untuk menentukan skop adalah membuka senarai pakej dalam tetapan dan masukkan "bahasa". Buka pakej sintaks yang diperlukan dan cari definisi "skop" berhampiran bahagian atas.
Julat coretan kod dalam snippets.cson
juga mesti menambah tempoh pada permulaan rentetan. Rentang bahasa web yang popular termasuk:
.text.html.basic
.source.css
.source.sass
.source.js
.source.json
.text.html.php
.source.java
.text.html.erb
.source.python
.text.plain
Setelah fail
console.log('%j', Object);
snippets.cson
.source.js
Coretan kod dinamakan "Log Json" lj
Badan coretan kod ditetapkan kepada console.log('%j', Object);
dipilih dalam ${1:Object}
, jadi ia boleh ditukar kepada nama objek yang sesuai. Object
console.log('%j', Object);
coretan kod lain boleh ditambah ke bahagian bawah fail
untuk merakam panjang sebarang array: snippets.cson
.source.js
'.source.js': 'Snippet Name': 'prefix': 'Snippet Trigger' 'body': 'Hello World!'
muncul, anda akan melihat dua kursor dan kedua -dua contoh ${1:array}
akan diserlahkan - anda hanya menaip nama array sekali dan kedua -duanya akan berubah! console.log('array length', array.length);
array
coretan kod multi-line
Jika anda merasa lebih mencabar, anda boleh menggunakan tiga petikan berganda "" untuk menentukan coretan kod berbilang baris yang lebih lama pada permulaan dan akhir kod badan. Coretan kod ini menghasilkan 2 × 2 dengan satu baris header tunggal Jadual:
<img src="" alt="" />
lekukan kod di dalam badan coretan kod tidak mempunyai kesan ke atas definisi CSON, tetapi saya cadangkan anda melengkapkannya di luar definisi badan untuk kebolehbacaan yang lebih besar. Saya mengucapkan selamat bertulis mengenai coretan kod! Jika anda baru kepada Atom, anda juga harus merujuk kepada 10 Add-on Atom Essential untuk pakej yang disyorkan.
Soalan Lazim menggunakan coretan kod dalam atom
Membuat coretan kod baru dalam atom adalah proses yang mudah. Pertama, anda perlu membuka fail coretan kod dengan pergi ke menu fail dan kemudian ke coretan kod. Ini akan membuka fail .cson di mana anda boleh menentukan coretan kod. Setiap coretan kod bermula dengan garis .source
yang menentukan bahasa yang digunakannya, diikuti dengan nama coretan kod dalam petikan. Anda kemudian menentukan awalan yang akan mencetuskan coretan kod dan badan coretan kod itu sendiri. Badan boleh menjadi pelbagai baris dan menggunakan sintaks ${1:default_text}
untuk menentukan tab.
Untuk menggunakan coretan kod dalam atom, anda hanya menaip awalan yang ditakrifkan untuk coretan kod dan tekan kekunci "Tab". Ini memasukkan badan coretan kod pada kursor. Jika coretan kod anda mempunyai tab, anda boleh menggunakan kekunci "Tab" untuk bergerak di antara mereka dan masukkan teks yang anda inginkan.
Ya, anda boleh menggunakan coretan kod untuk mana -mana bahasa pengaturcaraan yang disokong oleh atom. Anda hanya perlu menentukan skop bahasa yang betul apabila menentukan coretan kod. Sebagai contoh, untuk JavaScript anda akan menggunakan .source.js
dan untuk python anda akan menggunakan .source.python
.
Jika anda ingin berkongsi coretan kod anda dengan orang lain, anda hanya boleh berkongsi fail snippets.cson
anda. Fail ini mengandungi semua definisi coretan kod anda dan boleh didapati dalam direktori konfigurasi atom anda. Sebagai alternatif, anda boleh membuat pakej dengan coretan kod dan menerbitkannya ke repositori pakej atom.
benar -benar! Coretan kod adalah cara terbaik untuk memasukkan blok kod biasa. Anda boleh menentukan coretan untuk mana -mana coretan yang anda taip dengan kerap dan kemudian masukkannya dengan hanya beberapa kunci. Ini dapat menjimatkan banyak masa dan membantu memastikan konsistensi dalam kod anda.
Untuk mengedit coretan kod sedia ada dalam atom, anda perlu membuka fail snippets.cson
dan cari coretan kod untuk diedit. Anda kemudian boleh mengubah suai awalan, badan, atau skop yang diperlukan. Apabila anda selesai, ingatlah untuk menyimpan fail untuk memohon perubahan.
Ya, anda boleh menggunakan pembolehubah dalam coretan kod anda. Pembolehubah diwakili oleh ${1:default_text}
, di mana "1" adalah tab dan "default_text" adalah teks lalai yang akan dimasukkan. Anda boleh menggunakan pembolehubah untuk membuat ruang letak dalam coretan kod supaya anda dapat dengan cepat mengisi ruang letak ini apabila memasukkan coretan kod.
Untuk memadam coretan kod dalam atom, anda perlu membuka fail snippets.cson
dan cari coretan kod yang akan dipadam. Kemudian, padamkan garis kod yang mentakrifkan coretan kod dan simpan fail. Coretan kod akan dipadamkan dengan segera.
Walaupun atom tidak mempunyai fungsi terbina dalam untuk mengimport coretan kod dari editor lain, anda boleh menyalin definisi coretan secara manual dari editor lain dan tampalnya ke dalam fail snippets.cson
dalam atom. Anda mungkin perlu tweak sintaks sedikit untuk memadankan sintaks coretan kod Atom.
Ya, anda boleh menggunakan coretan kod dalam ciri mencari dan menggantikan atom. Apabila anda membuka panel Cari dan Ganti, anda boleh memasukkan coretan kod dalam medan Ganti. Apabila anda melakukan operasi penggantian, coretan kod dimasukkan ke dalam lokasi teks yang dijumpai.
Atas ialah kandungan terperinci Cara Menggunakan Coretan Kod di Atom. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!