Bagaimana cara memformat ulang HTML menggunakan Sublime Text 2?

Anda don't perlu plugin untuk melakukan hal ini. Cukup pilih semua garis (Pilih A) dan kemudian dari menu pilih Edit → Line → alinea ulang. Ini akan bekerja jika file anda disimpan dengan ekstensi yang berisi HTML suka .html atau .php.

Jika anda sering melakukan ini, anda mungkin menemukan kunci ini pemetaan yang berguna:

{ "keys": ["ctrl+shift+r"], "command": "reindent" , "args": { "single_line": false } }

Jika file ini tidak disimpan (misalnya anda hanya disisipkan dalam cuplikan ke jendela yang baru), anda dapat secara manual mengatur bahasa untuk indentasi dengan memilih menu View → Sintaks → bahasanya sebelum memilih alinea ulang pilihan.

Ada setengah lusin atau lebih cara-cara untuk format HTML di Luhur. I've diuji masing-masing plugin yang paling populer (lihat langgan saya lakukan pada blog saya untuk rincian lengkap), tapi di sini's sebuah gambaran singkat dari beberapa pilihan yang paling populer:

Alinea ulang perintah

Pro:

• Kapal dengan Luhur, sehingga tidak menginstal plugin yang dibutuhkan

Cons:

• Doesn't menghapus baris kosong ekstra
• Dapat't menangani minified HTML, garis-garis dengan beberapa kategori terbuka
• Doesn't dengan format <script> blok

Tag

Pro:

• Mendukung ST2/ST3
• Menghapus baris kosong ekstra
• Tidak ada biner dependensi

Cons:

• Tersedak pada tag PHP
• Doesn't menangani <script> blok dengan benar

HTMLTidy

Pro:

• Menangani tag PHP
• Beberapa pengaturan untuk men-tweak format

Cons:

• Membutuhkan PHP (jatuh kembali ke layanan web)
• ST2 hanya
• Ditinggalkan?

HTMLBeautify

Pro:

• Mendukung ST2/ST3
• Sederhana dan tidak binaray dependensi
• Dukungan untuk OS X, Win dan Linux

Cons:

• Tersedak sedikit dengan inline komentar
• Tidak memperluas diminimalkan/compressed kode

HTML-CSS-JS Mendandani

Pro:

• Mendukung ST2/ST3
• Menangani HTML, CSS, JS
• Besar integrasi dengan Luhur's menu
• Sangat disesuaikan
• Per-pengaturan proyek
• Format simpan pilihan

Cons:

• Membutuhkan Node.js
• Tidak bagus untuk tertanam PHP

Yang terbaik?

HTML-CSS-JS Mendandani adalah pemenang dalam buku saya. Banyak fitur yang besar, tidak banyak mengeluh tentang.

Satu-satunya paket I've telah mampu menemukan Tag.

Anda dapat menginstalnya menggunakan package control. https://sublime.wbond.net

Setelah menginstal paket kontrol. Pergi untuk paket kontrol (Preferensi -> Paket Kontrol) kemudian ketik install, hit enter. Kemudian ketik tag dan tekan enter.

Setelah menginstal Tag, sorot teks dan tekan shortcut Pilih+Alt+A.

Saya merekomendasikan plugin ini: HTML/CSS/JS Mendandani, Itu benar-benar bekerja.

Setelah instalasi, pilih saja kode dan tekan Ctrl+Shift+H.

Selesai!

Umumnya ujung. Apa yang saya lakukan untuk auto-merapikan HTML saya, adalah menginstal paket HTML_Tidy, dan kemudian tambahkan kode berikut ini di kombinasi tombol yang digunakan untuk pengaturan default (yang saya gunakan):

{ "keys": ["enter"], "command": "html_tidy" },

ini berjalan HTML Rapi dengan setiap masukkan. Mungkin ada kelemahan ini, aku'm cukup baru untuk Luhur sendiri, tetapi tampaknya untuk melakukan apa yang saya inginkan :)

Meskipun pertanyaannya adalah untuk HTML, saya akan juga ingin memberikan info tentang cara auto-format kode Javascript untuk Sublime Text 2;

Anda dapat memilih semua kode anda(pilih + A) dan gunakan di-app fungsi, alinea ulang(Edit -> Line -> alinea ulang) atau anda dapat menggunakan JsFormat format plugin untuk Sublime Text 2 jika anda ingin memiliki lebih banyak pengaturan yang dapat disesuaikan pada cara format kode anda ke samping Sublime Text's default tab/indent pengaturan.

https://github.com/jdc0589/JsFormat

Anda dapat dengan mudah menginstal JsFormat dengan menggunakan Package Control (Preferensi -> Paket Kontrol) Membuka paket kontrol lalu jenis menginstal, tekan enter. Kemudian ketik js format dan tekan enter anda'kembali dilakukan. (Paket controller akan menunjukkan status instalasi dengan keberhasilan dan kesalahan pada bagian kiri bawah bar Luhur)

Tambahkan baris berikut ke key binding (Preferensi -> Binding Kunci User)

{ "keys": ["ctrl+alt+2"], "command": "js_format"}

I'm menggunakan pilih + alt + 2, anda dapat mengubah cara pintas ini kunci apa pun yang anda ingin. Sejauh ini, JsFormat adalah plugin yang baik, layak untuk mencoba!

Berharap ini akan membantu seseorang.

Ada's sebuah plugin yang disebut SublimeHtmlTidy yang bekerja dengan cukup baik

https://github.com/welovewordpress/SublimeHtmlTidy

Bagi saya, HTML Mendandani solusi yang sangat sederhana. Aku pergi ke HTML Mendandani halaman.

1. Dibutuhkan Luhur Package Manager
2. Mengikuti Petunjuk untuk menginstal package manager di sini
3. mengetik cmd + shift + p untuk memunculkan menu
4. Diketik mendandani
5. Pilih HTML mendandani pilihan dalam menu

Boom. Dilakukan. Terlihat besar

Cukup pergi ke

Edit -> Tag -> Auto-format tag pada dokumen

Saya membuat sebuah Paket yang disebut HTMLBeautify yang melakukan pekerjaan yang layak memformat ulang HTML. Saya didasarkan dari Perl script yang saya temukan kembali pada tahun 1997—aku diperbarui untuk bekerja dengan semua baru ketinggalan jaman modern kategori. :)

Check it out dan biarkan aku tahu apa yang anda pikirkan!

https://github.com/rareyman/HTMLBeautify

Saya belum memiliki hak istimewa untuk komentar jadi, ini adalah hanya informasi tambahan yang berkaitan dengan @peter's jawaban jawaban di atas.

Saya menemukan HTML lakukan tidak sesuai seperti yang diharapkan jika IE bersyarat komentar di header itu tidak benar-benar di-line misalnya siram ke kiri:

Ada yang bagus dan open source CodeFormatter plugin, yang(bersama reindenting) dapat mempercantik kode kotor bahkan semua itu dalam satu baris.

Saya pikir ini adalah apa yang anda'kembali mencari:

https://github.com/victorporof/Sublime-HTMLPrettify

I'm menggunakan tidy bersama-sama dengan kustom membangun sistem untuk mendandani HTML.

Saya telah HTMLTidy.luhur-membangun Paket saya/User/ direktori:

{
  "cmd": ["tidy", "-config", "$packages/User/tidy_config.cfg", "$file"]
}

dan tidy_config.cfg file dalam direktori yang sama:

indent: auto
tab-size: 4
show-warnings: no
write-back: yes
quiet: yes
indent-cdata: yes
tidy-mark: no
wrap: 0

Dan hanya memilih membangun sistem dan tekan pilih+b atau cmd+b untuk memformat file konten. Salah satu masalah kecil dengan itu adalah bahwa ST2 tidak secara otomatis reload file sehingga untuk melihat hasilnya anda harus beralih ke beberapa file lain dan ke belakang (atau ke aplikasi lain dan kembali).

Di Mac saya've digunakan macports untuk menginstal rapi, pada Windows anda'a untuk men-download sendiri dan menentukan direktori kerja dalam membangun sistem, di mana rapi terletak:

"working_dir": "c:\\HTMLTidy\\"

atau menambahkannya ke JALAN.

anda dapat mengatur tombol pintas F12 mudah!!!

{ "keys": ["f12"], "command": "reindent" , "args": { "single_line": false } }

lihat detail di sini.