117

मुझे HTML के किसी भी कोड को करने में थोड़ी देर हो गई है Vim, लेकिन हाल ही में मैं फिर से आया हूं। कहो मैं कुछ सरल लिख रहा हूँ HTML:

<html><head><title>This is a title</title></head></html>

मैं शीर्षक, सिर और HTML के लिए उन समापन टैग को जल्दी से कैसे लिखूं? मुझे ऐसा लग रहा है कि मुझे यहाँ कुछ बहुत ही सरल तरीके से याद आ रही है जिसमें मुझे शामिल नहीं किया जा रहा है।

बेशक मैं CtrlPव्यक्तिगत टैग नामों को स्वत: पूर्ण करने के लिए उपयोग कर सकता हूं, लेकिन मेरे लैपटॉप कीबोर्ड पर मुझे जो मिलता है वह वास्तव में कोष्ठक और स्लैश सही है।

— WDS
स्रोत

38

इसकी जांच करें..

closetag.vim

Functions and mappings to close open HTML/XML tags

https://www.vim.org/scripts/script.php?script_id=13

मैं कुछ इसी तरह का उपयोग करता हूं।

— इयान पी
स्रोत

मैंने इसे स्थापित किया है। यह स्वचालित रूप से पास टैग पूरा नहीं करता है। शॉर्टकी क्या है? मैं कोशिश करता हूं Ctrl-_, लेकिन यह मेरे टर्मिनल का छोटा फ़ॉन्ट बनाता है।

— alhelal

74

मुझे xmledit प्लगइन का उपयोग करना बहुत उपयोगी लगता है। यह कार्यक्षमता के दो टुकड़े जोड़ता है:

जब आप कोई टैग (खोलने जैसे प्रकार <p>), यह जल्द ही आप बंद करने लिखते ही के रूप में टैग का विस्तार >में <p></p>और डालने मोड में टैग के अंदर कर्सर देता है।
यदि आप तुरंत दूसरा टाइप करते हैं >( जैसे आप टाइप करते हैं <p>>), तो यह उस में फैलता है

<p>

</p>

और कर्सर को टैग के अंदर रखता है, एक बार इंडेंट करता है, इन्सर्ट मोड में।

एक्सएमएल vim प्लगइन कोड तह और इन सुविधाओं के लिए नेस्टेड टैग मिलान कहते हैं।

बेशक, आपको टैग को बंद करने के बारे में चिंता करने की ज़रूरत नहीं है यदि आप मार्कडाउन में अपनी HTML सामग्री लिखते हैं और %!अपनी पसंद के मार्कडाउन प्रोसेसर के माध्यम से अपने विम बफर को फ़िल्टर करने के लिए उपयोग करते हैं :)

— hakamadare
स्रोत

क्या '</' टाइप होने पर यह प्लग-इन टैग बंद हो सकता है? या बस कुछ कीस्ट्रोक के साथ समापन टैग डालें? कभी-कभी आप समापन टैग को हटा देते हैं और चाहते हैं कि इसे बाद में डाला जाए ...

— bzx

7

मुझे यह प्लगइन पसंद नहीं है क्योंकि यह आपके कर्सर को उत्पन्न टैग के अतीत को प्राप्त करने का एक आसान तरीका प्रदान नहीं करता है। उदाहरण के लिए, यदि आप "Have a <b> nice </ b> day" लिखना चाहते हैं, तो आप "Have a <b> nice" लिखकर प्रारंभ करें, जो "है <b> अच्छा </ b" के रूप में प्रस्तुत करता है। > "। फिर आपको शेष वाक्य के साथ जारी रखने के लिए या तो दाईं ओर तीर डालना होगा या सम्मिलित मोड से बाहर निकलना होगा। यही कारण है कि एक समाधान जहां आप एक कुंजी दबाते हैं अंत टैग को सम्मिलित करना बेहतर होता है।

— 6

1

@exclipy विम के पास इसके लिए बहुत सारे बिल्ट-इन तरीके हैं। शुरुआत के लिए 'ई', 'एफ' और 'ए' कमांड का प्रयास करें।

— user456584

3

मैं के साथ xmledit प्लगइन स्थापित किया git clone https://github.com/sukima/xmledit.git ~/.vim/bundle/xmledit। लेकिन यह केवल .xml फ़ाइलों को संपादित करते समय काम करता है। जब फ़ाइल ext है। Html या .htm, यह काम नहीं करता है।

— चाड

2

@ वर्तमान में, मेरा समाधान एक ही निर्देशिका में फ़ाइल को कॉपी पेस्ट करने का था, इसका नाम बदलकर "html.vim" कर दिया, ताकि यह HTML फ़ाइलों को भी प्रभावित करे। अब, मेरे पास ~ / .vim / ftplugin (xml.vim और html.imim) में सटीक दो समान फाइलें हैं।

— user2719875

56

मुझे न्यूनतम चीजें पसंद हैं,

imap ,/ </<C-X><C-O>

— SJH
स्रोत

4

<CX> <CO> क्या करता है? यह मेरे लिए कुछ नहीं करता है।

— एक्सक्लूसिव

8

ऐसे मामले हैं जहां कोई ", /" लिखना चाहेगा, इसलिए मैं उपयोगकर्ता को एक अलग शॉर्टकट बनाना चाहूंगा। एक और विस्तार यह है कि ओमनी-समापन को बंद किया जाना चाहिए, अतिरिक्त इनपुट की प्रतीक्षा नहीं करनी चाहिए। तो:imap <silent> <C-c> </<C-X><C-O><C-X>

1

बहुत ही शांत। इसके <Esc>F<iअंत में भी जोड़ा जाता है ताकि यह कर्सर को टैग के अंदर वापस रखे।

— mVChr

इस कमांड का उपयोग इन्सर्ट मोड में करें, फिर ,/टैग को बंद करने के लिए हिट करें

— thedanotto

उपरोक्त समाधान में बहुत अधिक उत्थान हैं लेकिन इसमें मेरे जैसे विशेष रूप से शुरुआती लोगों के स्पष्टीकरण की कमी है। यह कैसे काम करता है और कोई इसका उपयोग कैसे करता है?

— फेमेलो खेथो

49

मुझे लगता है कि मेरे लिए खुलने और बंद होने वाले टैग को लिखने के बजाय सिर्फ एक समापन के लिए इसे और अधिक ठोस बनाना है। आप टिम पोप द्वारा उत्कृष्ट ragtag प्लगइन का उपयोग कर सकते हैं । उपयोग इस तरह दिखता है (आप कर्सर की स्थिति को चिह्नित करें) टाइप करें:

अवधि |

दबाएँ CTRL+x SPACE

और आपको मिलता है

<Span> | </ span>

तुम भी उपयोग कर सकते हैं CTRL+ x ENTERके बजाय CTRL+ x SPACE, और आप मिल

<Span>
|
</ Span>

रैगटग केवल इसे से अधिक कर सकते हैं (उदाहरण के लिए <% = इस% के आसपास सामान> या DOCTYPE)। आप शायद रागग के लेखक द्वारा अन्य प्लगइन्स की जांच करना चाहते हैं , विशेष रूप से चारों ओर ।

— क्रेजीसेक गोज
स्रोत

+1 बहुत बढ़िया! Btw, इसे अब इस रूप में जाना जाता है ragtag: vim.org/scripts/script.php?script_id=1896

— neezer

यह निश्चित रूप से सबसे सरल है। टेक्स्टमेट के पास यह अच्छा था, लेकिन विम ने इसे धन्यवाद दिया, धन्यवाद।

— जोसेमोटा

23

यदि आप कुछ विस्तृत कर रहे हैं, तो स्पार्कअप बहुत अच्छा है।

उनकी साइट से एक उदाहरण:

ul > li.item-$*3 इसका विस्तार:

<ul>
    <li class="item-1"></li>
    <li class="item-2"></li>
    <li class="item-3"></li>
</ul>

एक के साथ <C-e>।

प्रश्न में दिए गए उदाहरण को करने के लिए,

html > head > title{This is a title}

पैदावार

<html>
  <head>
    <title>This is a title</title>
  </head>
</html>

— thanthese
स्रोत

बहुत बहुत धन्यवाद! यह केवल मेरे द्वारा ही नहीं बल्कि किसी भी अन्य संपादकों के बीच पहले से देखी गई चीजों की तुलना में कूलर है! उत्तम!

— क्रिस

यह एक महान प्लगइन है

— DenniJensen

यह प्लगइन zen-coding से विकसित हुआ है। बाद वाले को अब एम्मेट के रूप में जाना जाता है और इसमें थोड़ा बड़ा फीचर सेट है।

— chb

17

एक zencoding vim प्लगइन भी है: https://github.com/mattn/zencoding-vim

ट्यूटोरियल: https://github.com/mattn/zencoding-vim/blob/master/TUTORIAL

अद्यतन: इसे अब Emmet कहा जाता है : http://emmet.io/

ट्यूटोरियल का एक अंश:

1. Expand Abbreviation

  Type abbreviation as 'div>p#foo$*3>a' and type '<c-y>,'.
  ---------------------
  <div>
      <p id="foo1">
          <a href=""></a>
      </p>
      <p id="foo2">
          <a href=""></a>
      </p>
      <p id="foo3">
          <a href=""></a>
      </p>
  </div>
  ---------------------

2. Wrap with Abbreviation

  Write as below.
  ---------------------
  test1
  test2
  test3
  ---------------------
  Then do visual select(line wize) and type '<c-y>,'.
  If you request 'Tag:', then type 'ul>li*'.
  ---------------------
  <ul>
      <li>test1</li>
      <li>test2</li>
      <li>test3</li>
  </ul>
  ---------------------

...

12. Make anchor from URL

  Move cursor to URL
  ---------------------
  http://www.google.com/
  ---------------------
  Type '<c-y>a'
  ---------------------
  <a href="http://www.google.com/">Google</a>
  ---------------------

— प्रीत कुकरेती
स्रोत

जो, माणिक के निर्माता द्वारा है?

— tjklemz

13

मानचित्रण

मुझे अपने ब्लॉक टैग (जैसे इनलाइन के विपरीत) तुरंत बंद करना पसंद है और जितना संभव हो उतना सरल शॉर्टकट के साथ (मैं CTRLजहां संभव हो विशेष कुंजी से बचना पसंद करता हूं, हालांकि मैं closetag.vimअपने इनलाइन टैग को बंद करने के लिए उपयोग करता हूं।) मुझे इसका उपयोग करना पसंद है। टैग्स के ब्लॉक शुरू करते समय शॉर्टकट (@kimilhee के लिए धन्यवाद; यह उनके जवाब का टेक ऑफ है):

inoremap ><Tab> ><Esc>F<lyt>o</<C-r>"><Esc>O<Space>

नमूना उपयोग

प्रकार-

<p>[Tab]

परिणाम-

<p>
 |
</p>

जहाँ |कर्सर स्थिति इंगित करता है।

व्याख्या

inoremap साधन डालने मोड में मानचित्रण बनाएँ
><Tab> एक समापन कोण कोष्ठक और एक टैब वर्ण का अर्थ है; यह वही है जो मेल खाता है
><Esc> का मतलब है पहले टैग को समाप्त करना और सामान्य मोड में सम्मिलित होने से बच जाना
F< का अर्थ है अंतिम खुलने वाला कोष्ठक
l इसका मतलब है कि कर्सर को एक सीध में ले जाएं (उद्घाटन कोण ब्रैकेट की प्रतिलिपि न करें)
yt> साधन अगले समापन कोण कोष्ठक से पहले जब तक अप करने के लिए कर्सर की स्थिति से झटका (यानी टैग सामग्री की प्रतिलिपि)
o</ साधन डालने मोड में नई लाइन शुरू करने और एक कोण कोष्ठक जोड़ने और स्लेश
<C-r>" डिफ़ॉल्ट रजिस्टर से डालने मोड में पेस्ट का मतलब है ( ")
><Esc> मतलब क्लोजिंग टैग बंद करें और इन्सर्ट मोड से बाहर निकलें
O<Space> इसका मतलब है कि कर्सर के ऊपर इन्सर्ट मोड में एक नई लाइन शुरू करें और एक स्पेस डालें

— कीथ पिंसन
स्रोत

@ Wds वाह, हाँ, मैंने इस तथ्य के बारे में कभी नहीं सोचा कि lइसका मतलब "सही" है और न कि "बाएं", "हाहा ... एक अजीब त्रुटि।" आपने मेरी पोस्ट के बारे में क्या सोचा? मैंने देखा कि आपने नहीं किया।

— कीथ पिंसन

यकीन के लिए अच्छा है। मैंने हाल ही में xml.vim प्लगइन का उपयोग करने के लिए लिया है (यह काफी अच्छी तरह से काम करता है)। मैं इसे अपने .vimrc में एक फ़ाइल-विशिष्ट-विशिष्ट ऑटोकॉमैंड के साथ जोड़ने का सुझाव दूंगा, अर्थात:au filetype html inoremap <buffer> ...

— wds

1

अंत में एक आटोक्लास कमांड जो ठीक वैसे ही काम करता है जैसे कि - इसे पूरी तरह से करना चाहिए!

— cnp

मुझे टैग के बीच अपना कर्सर रखना पसंद है। इसलिए मैंने अपनी आवश्यकता के अनुरूप इसे संशोधित किया। inoremap ><Tab> ><Esc>F<lyt>o</<C-r>"><Esc>kJxiमैंने हटाया 0<Space>और जोड़ा kJxi। 1 चरण ऊपर जाएं, दो पंक्तियों को मिलाएं, एक वर्ण को निकालें और फिर इन्सर्ट मोड में जाएं।

— समुंद्रा

9

चेक आउट `vim-closetag`

यह एक बहुत ही सरल स्क्रिप्ट है (एक vundleप्लगइन के रूप में भी उपलब्ध है ) जो आपके लिए (X) HTML टैग को बंद कर देती है। इससे README:

यदि यह वर्तमान सामग्री है:
<table|
अब आप दबाएं >, सामग्री यह होगी:
<table>|</table>
और अब यदि आप >फिर से दबाते हैं , तो सामग्री होगी:
<table>
   |
</table>

नोट: |यहाँ कर्सर है

— Sheharyar
स्रोत

6

allml (अब रागटैग) और ओमनी-पूर्ण (<CX> <CO>) एक फ़ाइल में काम नहीं करता है जैसे .py या .java।

यदि आप उन फ़ाइल में टैग को स्वचालित रूप से बंद करना चाहते हैं, तो आप इस तरह से मैप कर सकते हैं।

imap <Cj> <ESC> F <lyt> $ a </ ^ R ">

(+ आर कंट्रास्ट + आर है: आप इस कंट्रोल + वी की तरह टाइप कर सकते हैं और फिर कंट्रोल + आर)

((कर्सर स्थिति है) अब यदि आप टाइप करते हैं ..

<P> abcde |

और टाइप ^ जे

तो यह इस तरह से टैग बंद करें ..

<P> abcde </ p> |

— kimilhee
स्रोत

imap के साथ <Cj> <ESC> mfF <lyt> `fa </ <CR>"> क्लोनिंग टैग वह जगह है जहाँ कर्सर तब टाइप किया गया था जब आप लाइन के अंत के बजाय ^ j ($)

— Piett

5

यहाँ आसानी से मिल सकने योग्य वेब लेखन पर आधारित एक और सरल उपाय है:

HTML टैग को स्वतः बंद करना

:iabbrev </ </<C-X><C-O>
पूरा होने पर चालू

autocmd FileType xml set omnifunc=xmlcomplete#CompleteTags

— mloskot
स्रोत

1

बहुत बढ़िया प्रतिक्रिया !!! कोई प्लगइन के साथ !!! (2 आइटम में लिंकरोट है) अभी भी शायद सभी का सबसे अच्छा जवाब है, क्योंकि यह प्लगइन्स को संभालने के बजाय .vimrc को संशोधित करने के लिए तेज लगता है। इसके अलावा सबसे कम से कम प्रतिक्रिया

— निलोन

यह बंद टैग के बाद स्थान जोड़ता है :(

— विटाली ज़ेडेनविच

4

@KeithPinson द्वारा उत्कृष्ट उत्तर का निर्माण (क्षमा करें, अभी तक आपके जवाब पर टिप्पणी करने के लिए पर्याप्त प्रतिष्ठा के बिंदु नहीं हैं), यह विकल्प स्वत: पूर्ण को HTML टैग (जैसे कक्षाएं, आईडी, आदि) के अंदर हो सकने वाली किसी भी चीज़ की प्रतिलिपि बनाने से रोक देगा। ।) लेकिन समापन टैग की नकल नहीं की जानी चाहिए।

अद्यतन मैंने filename.html.erbफ़ाइलों के साथ काम करने के लिए अपनी प्रतिक्रिया अपडेट की है ।
मैंने देखा कि मेरी मूल प्रतिक्रिया आमतौर पर रेल दृश्य में उपयोग की जाने वाली फाइलों में काम नहीं करती थी, जैसे कि some_file.html.erbजब मैं एम्बेडेड रूबी (जैसे <p>Year: <%= @year %><p>) का उपयोग कर रहा था । नीचे दिया गया कोड फाइलों के साथ काम करेगा.html.erb ।

inoremap ><Tab> ><Esc>?<[a-z]<CR>lyiwo</<C-r>"><Esc>O

नमूना उपयोग

प्रकार:

<div class="foo">[Tab]

परिणाम:

<div class="foo">
  |
<div>

जहाँ |कर्सर स्थिति इंगित करता है

और ब्लॉक शैली के बजाय समापन टैग इनलाइन को जोड़ने के एक उदाहरण के रूप में:

inoremap ><Tab> ><Esc>?<[a-z]<CR>lyiwh/[^%]><CR>la</<C-r>"><Esc>F<i

नमूना उपयोग

प्रकार:

<div class="foo">[Tab]

परिणाम:

<div class="foo">|<div>

जहाँ |कर्सर स्थिति इंगित करता है

यह सच है कि उपरोक्त दोनों उदाहरण >[Tab]एक समापन टैग को इंगित करने पर निर्भर करते हैं (जिसका अर्थ है कि आपको या तो इनलाइन या ब्लॉक शैली चुनना होगा )। व्यक्तिगत रूप से, मैं ब्लॉक-स्टाइल का उपयोग करता हूं >[Tab]और इनलाइन शैली के साथ >>।

— निक एरहार्ट
स्रोत

Vim में HTML टैग को जल्दी से कैसे बंद कर सकते हैं?

मानचित्रण

नमूना उपयोग

व्याख्या

चेक आउट vim-closetag

चेक आउट `vim-closetag`