ฉันจะจัดระเบียบการเยื้องของไฟล์ HTML ใน VI ได้อย่างไร

130

ฉันจะแก้ไขการเยื้องของไฟล์ html ขนาดใหญ่ของเขาที่ยุ่งเหยิงได้อย่างไร

ฉันลองใช้"gg=Gคำสั่งปกติซึ่งเป็นสิ่งที่ฉันใช้เพื่อแก้ไขการเยื้องของไฟล์โค้ด อย่างไรก็ตามดูเหมือนว่าจะไม่ทำงานในไฟล์ HTML เพียงแค่ลบการจัดรูปแบบทั้งหมด

ฉันยังลองตั้งค่า:filetype = xmlเพื่อดูว่าการหลอกให้คิดว่านี่เป็นไฟล์ XML จะช่วยได้หรือไม่ แต่ก็ยังไม่ทำ

html vim vi indentation

— mmcdole
แหล่งที่มา

91

กับfiletype indent onภายในของฉัน.vimrc, กลุ่มเยื้อง HTML ไฟล์อย่างมาก

ตัวอย่างง่ายๆที่มีshiftwidth2:

<html>
  <body>
    <p>
    text
    </p>
  </body>
</html>

— moinudin
แหล่งที่มา

15

คัดลอกวาง html ของหน้าคำถามนี้ลงในไฟล์ html เปิดด้วย VIM พิมพ์ "set smartindent" ตามด้วย "gg = G" และจะไม่แก้ไขการเยื้องของไฟล์

— mmcdole

15

มันใช้ได้กับฉัน ตั้งค่า ft = html <cr> ชุด si <cr> gg = G <cr> จัดรูปแบบหน้านี้ได้ค่อนข้างดี

— Don Reba

5

+1 ตรวจสอบแล้วว่า "เปิด / ปิดการเยื้องประเภทไฟล์" จะเปิดหรือปิดเวทมนตร์

— Wim Coenen

4

ใช่หลังจากตั้งค่า smart indent แล้ว filetype = html และและ filetype ก็ใช้งานได้สำหรับฉัน

— mmcdole

22

จากchovy.com/web-development/fix-indentation-and-tabs-in-vimพบว่าฉันต้องโหลดไฟล์ซ้ำด้วย: e after filetype indent on

— Marc Stober

189

มีหลายสิ่งที่จำเป็นต้องมี เพียงเพื่อสรุปทั้งหมดในที่เดียว:

ตั้งค่าตัวเลือกต่อไปนี้:

:filetype indent on
:set filetype=html           # abbrev -  :set ft=html
:set smartindent             # abbrev -  :set si

จากนั้นเลื่อนเคอร์เซอร์ไปที่ด้านบนสุดของไฟล์และเยื้องไปจนสุด: gg =G
หรือเลือกข้อความที่ต้องการเพื่อเยื้องและกด=เพื่อเยื้อง

— tylerl
แหล่งที่มา

@tyrel ขอบคุณ แต่สำหรับผมไม่ได้ทำงาน .. นี่คือเนื้อหาของแฟ้ม: pastebin.com/gagia8W2 home.htmlไฟล์จะถูกเรียกว่า ฉันไม่มีปัญหาในการเยื้องไฟล์. php ที่นี่คุณมี. vimrc ของฉัน: pastebin.com/FAJ0MCA9

— ziiweb

1

มีวิธีตั้งค่านี้ใน. vimrc หรือไม่ ฉันไม่อยากบอกทุกครั้งที่เปิดไฟล์ HTML ว่าเป็นไฟล์ HTML ขอบคุณมากสำหรับ gg, =, G ทางลัด มีประโยชน์จริงๆ

— zakishaheen

1

ทราบว่าในvim 7.4การเริ่มต้นการตั้งค่าการเยื้องจะล้มเหลวเช่นนี้เช่นhtml, bodyและpจะไม่เยื้องโดยค่าเริ่มต้น ดูคำตอบนี้

— Cory Klein

2

smartindentไม่จำเป็น นอกจากนี้ยังได้รับการปรับแต่งสำหรับ C และ C ++ ฉันชอบใช้ทั่วไปมากกว่าautoindentแทน

— คอส

ใช้งานได้ดีกับ vim7.4 @tylerl มีวิธีใดในการกำหนดค่านี้ให้ถาวรสำหรับไฟล์ html ใน 7.4 หรือไม่

— xaph

62

ปัญหาหลักในการใช้การเยื้องอัจฉริยะคือหาก XML (หรือ HTML) อยู่ในบรรทัดเดียวเนื่องจากอาจกลับมาจากคำขอ curl ก็gg=Gจะไม่ทำเคล็ดลับ แต่ฉันเพิ่งได้สัมผัสกับการเยื้องที่ดีโดยใช้ความเป็นระเบียบที่เรียกโดยตรงจาก VI:

:!tidy -mi -xml -wrap 0 %

สิ่งนี้บอกให้ VI เรียกความเป็นระเบียบเรียบร้อยในการล้างไฟล์ XML โดยไม่ตัดบรรทัดเพื่อให้พอดีกับบรรทัดเริ่มต้นกว้าง 68 อักขระ ฉันประมวลผลไฟล์ XML ขนาดใหญ่ 29MB และใช้เวลา 5 หรือ 6 วินาที ฉันเดาว่าสำหรับไฟล์ HTML คำสั่งควรเป็น:

:!tidy -mi -html -wrap 0 %

ตามที่กล่าวไว้ในความคิดเห็นtidyเป็นเครื่องมือพื้นฐานที่คุณสามารถพบได้ในระบบพื้นฐาน Linux / MacOS นี่คือหน้า Projet ในกรณีที่คุณขอให้คุณมี แต่ไม่ได้: HTML เป็นระเบียบเรียบร้อย

— oscaroscar
แหล่งที่มา

1

ฉันไม่เชื่อว่าจำเป็นต้องใช้ html เนื่องจากมีค่าเริ่มต้นเป็น html

— lsiebert

4

เห็นด้วยกับคุณ @Isieber. อย่างไรก็ตามฉันเดาว่ามันช่วยให้เข้าใจตรรกะได้ง่ายขึ้นและบางคนอาจถือเป็นแนวทางปฏิบัติที่ดี

— oscaroscar

2

FYI, chokes ที่เป็นระเบียบเรียบร้อยหาก HTML มี SVG (เช่นแผนภูมิ ฯลฯ )

— Alex Quinn

1

ใช่ถ้าโค้ด html อยู่ในบรรทัดเดียวคำสั่ง vim indent จะไม่ทำงาน!

— wisbucky

ความเป็นระเบียบเรียบร้อยนอกจากคำในพจนานุกรมคืออะไร? นี่ไม่ใช่คำตอบที่สมบูรณ์หากไม่มีการเชื่อมโยงกับโครงการ

— Bruno Bronosky

49

ตามที่ tylerl อธิบายข้างต้นให้ตั้งค่าต่อไปนี้:

:filetype indent on
:set filetype=html
:set smartindent

อย่างไรก็ตามทราบว่าในกลุ่ม 7.4 แท็ก HTML html, head, bodyและอื่น ๆ บางคนจะไม่เยื้องโดยค่าเริ่มต้น สิ่งนี้สมเหตุสมผลเนื่องจากเนื้อหาเกือบทั้งหมดในไฟล์ HTML อยู่ภายใต้แท็กเหล่านั้น หากคุณต้องการจริงๆคุณสามารถทำให้แท็กเหล่านั้นเยื้องได้ดังนี้:

:let g:html_indent_inctags = "html,body,head,tbody"

โปรดดู "การเยื้อง HTML ไม่ทำงานใน Vim 7.4 ที่คอมไพล์แล้วมีแนวคิดใดบ้าง " และ " สคริปต์เยื้อง html ทางเลือก " สำหรับข้อมูลเพิ่มเติม

— คอรีไคลน์
แหล่งที่มา

นี่คือผู้ชนะในหนังสือของฉัน! ใช้ Vim 7.4 บน Windows และทำงานได้ยอดเยี่ยมมาก! : D

— Michael J

12

นี่คือวิธีแก้ปัญหาของฉันที่ใช้ได้ดีกับการเปิด HTML ที่ "น่าเกลียด" โดยเว้นระยะห่างกันพอสมควร:

vim fileIn.html -c "set sw=2 | %s/>/>\r/ | execute 'normal gg=G' | set nohlsearch | g/^\\s*\$/d"

swคำสั่งเป็นเพราะเริ่มต้นของฉันคือ 4 ซึ่งสูงเกินไปสำหรับ HTML
ส่วนถัดไปจะเพิ่มบรรทัดใหม่ (Vim คิดว่าเป็นการกลับรถแล้วถอนหายใจ) หลังจากแต่ละองค์ประกอบ ( >)
จากนั้นเยื้องไฟล์ทั้งหมดด้วย=.
จากนั้นเลิกไฮไลท์>(เนื่องจากฉันมีset hlsearchใน vimrc ของฉัน)
จากนั้นลบบรรทัดว่าง / เฉพาะช่องว่างทั้งหมด (ดู "เป็นกลุ่มลบบรรทัดว่าง " สำหรับข้อมูลเพิ่มเติมและนี่คือการใช้ Escape สองครั้งเนื่องจากอยู่ในเชลล์)

คุณสามารถเพิ่มลง| wq! fileOut.htmlในตอนท้ายได้หากคุณไม่ต้องการเข้าสู่ Vim เลย แต่เพียงแค่ล้างไฟล์

— adam_0
แหล่งที่มา

น้ำยาเรียบร้อย! ฉันแก้ไขเป็น:%s/>\s*/>\r/g(เพิ่ม a gสำหรับการแทนที่ทั่วโลกและ\s*เพื่อตัดช่องว่างต่อท้ายออก) ฉันยังเพิ่ม:%s/</\r</gเพื่อเพิ่มขึ้นบรรทัดใหม่ก่อนวงเล็บเปิด มิฉะนั้นแท็กเหมือน<td>foo</td>จะแยกเหมือนและ<td> foo</td>

— wisbucky

จุดที่ยุติธรรมฉันได้เปิดการแทนที่ทั่วโลกโดยค่าเริ่มต้นซึ่งเป็นสาเหตุที่ไม่ได้อยู่ในโซลูชันของฉัน

— adam_0

7

ฉันใช้สคริปต์นี้: https://github.com/maksimr/vim-jsbeautify

ในลิงค์ด้านบนคุณมีข้อมูลทั้งหมด:

ติดตั้ง
กำหนดค่า (คัดลอกจากตัวอย่างแรก)
วิ่ง :call HtmlBeautify()

งานสวยมั้ย!

— SimonW
แหล่งที่มา

3

ฮ่า ๆ ทำไมคุณถึงต้องการใช้ node + js เพื่อล้าง html ใน vim ซึ่งมีความสามารถนี้ในตัวนานกว่า node ที่มีอยู่ด้วยซ้ำ ... ทำให้ฉันคิดไม่ถึง ..

— mb21

4

คุณได้ลองใช้สคริปต์การเยื้อง HTML บนไซต์ Vim หรือไม่?

http://www.vim.org/scripts/script.php?script_id=2075

— JaredPar
แหล่งที่มา

+1 ฉันไม่เห็นสิ่งนั้น คงจะดีถ้าฉันไม่จำเป็นต้องเรียกใช้สคริปต์ แต่ดูเหมือนว่านี่อาจเป็นวิธีเดียว

— mmcdole

สคริปต์นี้เลิกใช้งานแล้วและเวอร์ชันใหม่กว่ามาพร้อมกับ vim (เช่น/usr/share/vim/vim74/indent/html.vim) "2014 Jul 04: Vim 7.4.356 หรือใหม่กว่ามีผู้สืบทอดของสคริปต์นี้ (ขณะนี้สคริปต์อย่างเป็นทางการได้รับการดูแลโดย Bram และรวมถึงการเปลี่ยนแปลงครั้งใหญ่)"

— wisbucky

4

นี่เป็นวิธีแก้ปัญหาที่มีน้ำหนักมากซึ่งจะทำให้คุณเยื้องรวมทั้งการพิมพ์ HTML แบบสวย ๆ ทั้งหมดที่คุณไม่จำเป็นต้องสนใจในขณะที่คุณกำลังแก้ไข

ครั้งแรกที่ดาวน์โหลดเรียบร้อย ตรวจสอบให้แน่ใจว่าคุณได้เพิ่มไบนารีลงในเส้นทางของคุณเพื่อให้คุณสามารถเรียกใช้จากตำแหน่งใดก็ได้

จากนั้นสร้างไฟล์กำหนดค่าที่อธิบายรสชาติ HTML ที่คุณชื่นชอบ เอกสารประกอบไม่ดีสำหรับ Tidy แต่นี่คือภาพรวมและรายการตัวเลือกทั้งหมด นี่คือไฟล์กำหนดค่าของฉัน:

bare: yes
break-before-br: no
clean: yes
drop-proprietary-attributes: yes
fix-uri: yes
indent-spaces: 4
indent: yes
logical-emphasis: yes
markup: yes
output-xhtml: yes
quiet: yes
quote-marks: yes
replace-color: yes
tab-size: 4
uppercase-tags: no
vertical-space: yes
word-2000: yes
wrap: 0

บันทึกสิ่งนี้ไว้tidyrc_html.txtในftpluginโฟลเดอร์ของคุณ(ภายใต้ vimfiles)

อีกไฟล์หนึ่ง: เพิ่มบรรทัดต่อไปนี้ใน (หรือสร้าง) html.vimในftplugin:

map <leader>tidy :%! tidy -config ~/vimfiles/ftplugin/tidyrc_html.txt <CR>

ที่จะใช้มันเพียงแค่เปิดไฟล์ HTML /tidyและประเภท (นั่น/คือ<leader>กุญแจสำคัญ)

ไปเลย! ไม่ใช่วิธีแก้ปัญหาที่รวดเร็ว แต่ตอนนี้คุณพร้อมสำหรับการแก้ไขไฟล์ HTML ขนาดใหญ่ที่ยุ่งเหยิงแล้ว

— สัตว์จำพวกลิง
แหล่งที่มา

2

คุณสามารถรวมทั้งเป็นระเบียบเรียบร้อยและHTML-สวยงามโดยอัตโนมัติโดยการติดตั้งปลั๊กอินเป็นกลุ่ม-autoformat หลังจากนั้นคุณสามารถเรียกใช้งานฟอร์แมตเตอร์ใดก็ได้ที่ติดตั้งด้วยการกดแป้นพิมพ์ครั้งเดียว

— ชิเอลสิบบรินเก้
แหล่งที่มา

0

ฉันลองใช้คำสั่ง "gg = G" ตามปกติซึ่งเป็นสิ่งที่ฉันใช้เพื่อแก้ไขการเยื้องของไฟล์โค้ด อย่างไรก็ตามดูเหมือนว่าจะใช้งานไม่ได้กับไฟล์ HTML เพียงแค่ลบการจัดรูปแบบทั้งหมด

หากรูปแบบอัตโนมัติ / การเยื้องของกลุ่มgg=Gดูเหมือนจะ "เสีย" (เช่นการเยื้องซ้ายทุกบรรทัด) เป็นไปได้มากว่าปลั๊กอินการเยื้องไม่ได้เปิดใช้งาน / โหลด ควรให้ข้อความแสดงข้อผิดพลาดแทนที่จะทำเพียงแค่การเยื้องที่ไม่ดีมิฉะนั้นผู้ใช้จะคิดว่าคุณลักษณะการจัดรูปแบบอัตโนมัติ / การเยื้องนั้นแย่มากเมื่อมันค่อนข้างดี

เพื่อตรวจสอบว่าปลั๊กอินเยื้องถูกเปิดใช้งาน / :scriptnamesโหลดการทำงาน ดูว่า.../indent/html.vimอยู่ในรายการหรือไม่ ถ้าไม่แสดงว่าไม่ได้โหลดปลั๊กอิน ในกรณีนั้นให้เพิ่มบรรทัดนี้ไปที่~/.vimrc:

filetype plugin indent on

ตอนนี้ถ้าคุณเปิดแฟ้มและการทำงานคุณจะเห็น:scriptnames .../indent/html.vimจากนั้นเรียกใช้gg=Gซึ่งควรทำรูปแบบอัตโนมัติ / เยื้องที่ถูกต้องในขณะนี้ (แม้ว่าจะไม่เพิ่มขึ้นบรรทัดใหม่ดังนั้นหากโค้ด html ทั้งหมดอยู่ในบรรทัดเดียวโค้ดจะไม่ถูกเยื้อง)

หมายเหตุ: หากคุณกำลังรัน:filetype plugin indent onบนบรรทัดคำสั่ง vim แทนคุณ~/.vimrcต้องเปิดไฟล์:eอีกครั้ง

นอกจากนี้คุณไม่จำเป็นต้องกังวลautoindentและsmartindentการตั้งค่าก็ไม่เกี่ยวข้องกับสิ่งนี้

— wisbucky
แหล่งที่มา