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="" />

Kursor

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:

1. pengenal bahasa atau julat string
2. dengan mudah menggambarkan nama kod
3. Setelah kekunci TAB ditekan, teks pencetus coretan kod akan dicetuskan, dan
4. kod body coretan kod dengan tab pilihan.

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:

• html: .text.html.basic
• CSS: .source.css
• sass: .source.sass
• JavaScript: .source.js
• json: .source.json
php:
• .text.html.php
java:
• .source.java
Ruby:
• .text.html.erb
python:
• .source.python
teks biasa (termasuk markdown):
• .text.plain
Oleh itu, anda boleh menentukan coretan kod pembalakan JSON menggunakan kaedah berikut:

Setelah fail

console.log('%j', Object);

anda disimpan, coretan kod akan berkuatkuasa. Dalam contoh ini:

snippets.cson

Skop ditetapkan ke

(untuk JavaScript)
1. .source.js Coretan kod dinamakan "Log Json"
2. Tab Trigger (awalan) ditetapkan ke
3. lj Badan coretan kod ditetapkan kepada
(bagaimanapun, kami telah menambah beberapa kod kawalan tambahan seperti yang ditunjukkan di bawah).
4. console.log('%j', Object);
Petikan tunggal dalam badan mesti melarikan diri dengan backslash (). Perhentian tab ditakrifkan menggunakan tanda dolar diikuti dengan nombor, iaitu $ 1, $ 2, $ 3, dll. $ 1 adalah kedudukan tab pertama di mana kursor muncul. Apabila kekunci TAB ditekan, kursor akan bergerak ke $ 2, dan sebagainya. Tab di atas berhenti $ 1 telah ditakrifkan menggunakan teks lalai untuk mengingatkan atau mendorong pengguna:

. Apabila menggunakan coretan kod,

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

. Jika anda memerlukan dua atau lebih coretan kod bahasa yang sama, tambahkannya ke bahagian skop yang sepadan. Sebagai contoh, anda boleh membuat coretan kod JavaScript lain dalam skop

untuk merakam panjang sebarang array: snippets.cson .source.js

Sila ambil perhatian bahawa terdapat dua tag

'.source.js':
  'Snippet Name':
    'prefix': 'Snippet Trigger'
    'body': 'Hello World!'

. Apabila

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

Bagaimana untuk membuat coretan kod baru 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.

Bagaimana menggunakan coretan kod dalam atom?

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.

Bolehkah saya menggunakan coretan kod dalam mana -mana bahasa pengaturcaraan dalam atom?

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.

Bagaimana untuk berkongsi coretan kod saya dengan orang lain?

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.

Bolehkah saya menggunakan coretan kod untuk memasukkan blok kod yang biasa digunakan?

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.

Bagaimana untuk mengedit coretan kod sedia ada dalam atom?

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.

Bolehkah saya menggunakan pembolehubah dalam coretan kod?

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.

Bagaimana untuk memadam coretan kod dalam atom?

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.

Bolehkah saya mengimport coretan kod dari editor lain ke dalam atom?

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.

Bolehkah saya menggunakan coretan kod dalam mencari dan menggantikan fungsi 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!