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 03

74

Я считаю использование плагина xmledit довольно полезным. он добавляет две части функциональности:

Когда вы открываете тег ( например, тип <p>), он расширяет тег, как только вы вводите закрывающий >элемент, <p></p>и помещает курсор внутри тега в режиме вставки.
Если вы затем сразу набираете другой >( например, вы вводите <p>>), он заменяет это на

<p>

</p>

и помещает курсор внутри тега с однократным отступом в режиме вставки.

XML ВИМ плагин добавляет свертывание коды и вложенное соответствие тегов к этим функциям.

Конечно, вам вообще не нужно беспокоиться о закрывающих тегах, если вы пишете свой HTML-контент в Markdown и используете его %!для фильтрации своего буфера Vim через процессор Markdown по вашему выбору :)

— hakamadare
источник

Может ли этот плагин автоматически закрывать теги при вводе '</'? Или просто вставить закрывающий тег нажатием клавиши? Иногда вы удаляете закрывающий тег и хотите, чтобы он был вставлен позже ...

— bzx

7

Мне не нравится этот плагин, потому что он не предоставляет простой способ переместить курсор мимо созданного тега. Например, если вы хотите написать «Приятного <b> дня </b>», вы начнете с ввода «Приятного <b>», что будет выглядеть как «Приятного <b> | </ b >». Затем вам нужно либо стрелку вправо, либо выйти из режима вставки, чтобы продолжить остальную часть предложения. Вот почему решение, в котором вы нажимаете клавишу, чтобы вставить конечный тег, лучше.

— Exclipy

1

@exclipy В Vim есть множество встроенных способов сделать это. Для начала попробуйте команды «E», «f» и «A».

— user456584

3

Я установил плагин xmledit с расширением git clone https://github.com/sukima/xmledit.git ~/.vim/bundle/xmledit. Но работает только при редактировании файлов .xml. Когда файл ext имеет формат .html или .htm, он не работает.

— Чад

2

@Chad в настоящее время моим решением было скопировать и вставить файл в тот же каталог, точно переименовать его в «html.vim», чтобы он также влиял на файлы HTML. Теперь у меня есть два одинаковых файла в ~ / .vim / ftplugin (xml.vim и html.vim).

— user2719875

56

Я люблю минимализм,

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

— SJH
источник

4

Что делает <CX> <CO>? Для меня это ничего не значит.

— exclipy

8

Бывают случаи, когда нужно написать ", /", поэтому я бы предпочел использовать другой ярлык. Еще одна деталь - омни-завершение нужно закрывать, не дожидаясь дополнительного ввода. Итак:imap <silent> <C-c> </<C-X><C-O><C-X>

1

Очень круто. Также добавлен <Esc>F<iв конец, чтобы вернуть курсор внутрь тега.

— mVChr

чтобы использовать эту команду, ,/

— перейдите

Вышеупомянутое решение имеет много положительных отзывов, но ему не хватает объяснений, особенно для новичка, такого как я. Как это работает и как им пользоваться?

— Фемело Хето,

50

Я считаю более удобным заставить vim писать за меня открывающий и закрывающий теги, а не только закрывающий. Вы можете использовать отличный плагин ragtag от Тима Поупа. Использование выглядит так (позвольте | отметить позицию курсора), которое вы вводите:

пролет |

нажмите CTRL+x SPACE

и вы получите

<SPAN> | </ SPAN>

Вы также можете использовать CTRL+ x ENTERвместо CTRL+ x SPACE, и вы получите

<SPAN>
|
</ SPAN>

Ragtag может делать больше, чем просто (например, вставлять <% = stuff вокруг этого%> или DOCTYPE). Вы, вероятно, захотите проверить другие плагины автора ragtag , особенно Surround .

— Кшишек Гой
источник

+1 Отлично! Кстати, теперь это известно как ragtag: vim.org/scripts/script.php?script_id=1896

— neezer

Этот, безусловно, самый простой. У Textmate все было хорошо, но Vim справляется с этим, спасибо Krzysiek.

— josemota

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
источник

Оооочень большое спасибо! Это круче, чем все, что я видел раньше, не только Vim, но и среди любых других редакторов! Супер!

— Крис

Это отличный плагин

— DenniJensen

Этот плагин произошел от дзен-кодирования. Последний теперь известен как emmet и имеет немного больший набор функций.

— chb

17

Также существует плагин zencoding vim: https://github.com/mattn/zencoding-vim

руководство: https://github.com/mattn/zencoding-vim/blob/master/TUTORIAL

Обновление: теперь это называется Эммет : 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]

result-

<p>
 |
</p>

где |указывает положение курсора.

объяснение

inoremap означает создание сопоставления в режиме вставки
><Tab> означает закрывающие угловые скобки и символ табуляции; это то, что совпадает
><Esc> означает конец первого тега и выход из вставки в нормальный режим
F< означает найти последнюю открывающуюся угловую скобку
l означает переместить курсор вправо (не копировать открывающую угловую скобку)
yt> означает перемещение от позиции курсора до следующей закрывающей угловой скобки (т.е. копирование содержимого тегов)
o</ означает начать новую строку в режиме вставки и добавить открывающую угловую скобку и косую черту
<C-r>" означает вставку в режиме вставки из регистра по умолчанию ( ")
><Esc> означает закрыть закрывающий тег и выйти из режима вставки
O<Space> означает начать новую строку в режиме вставки над курсором и вставить пробел

— Кейт Пинсон
источник

@wds Вау, да, я никогда не задумывался о том, что lозначает "право", а не "лево", ха-ха ... какая забавная ошибка. Что вы думаете о моем посте? Я заметил, что вы не проголосовали.

— Кейт Пинсон,

Конечно, приятно. Недавно я начал использовать плагин xml.vim (он действительно неплохо работает). Я бы посоветовал добавить его в ваш .vimrc с помощью au filetype html inoremap <buffer> ...

— автокоманды, зависящей от типа файла

1

Наконец, команда Autoclose, которая работает именно так, как должна - просто!

— 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 (теперь Ragtag) и Омни-завершение (<CX> <CO>) не работают с такими файлами, как .py или .java.

если вы хотите автоматически закрыть тег в этом файле, вы можете сопоставить его.

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

(^ R - это Contrl + R: вы можете ввести, например, Control + v, а затем Control + r)

(| - позиция курсора) теперь, если вы введете ..

<Р> ABCDE |

и введите ^ j

затем закройте тег вот так ..

<Р> ABCDE </ р> |

— kimilhee
источник

с imap <Cj> <ESC> mfF <lyt> `fa </ <CR>"> тег клонирования находится там, где был курсор, когда вы вводили ^ j вместо конца строки ($)

— Пьетро,

5

Вот еще одно простое решение, основанное на легко доступном веб-письме:

Автоматическое закрытие HTML-тега

:iabbrev </ </<C-X><C-O>
Включение завершения

autocmd FileType xml set omnifunc=xmlcomplete#CompleteTags

— mloskot
источник

1

Шикарный ответ !!! без плагина !!! (2-й элемент имеет linkrot) по-прежнему, пожалуй, лучший ответ из всех, потому что кажется быстрее изменить .vimrc, чем обрабатывать плагины. Плюс самый минималистичный ответ

— nilon

Это добавляет пробел после закрытого тега :(

— Виталий Зданевич

4

Основываясь на отличном ответе @KeithPinson (извините, недостаточно очков репутации, чтобы прокомментировать ваш ответ), эта альтернатива предотвратит копирование при автозаполнении чего-либо дополнительного, что может быть внутри тега html (например, классов, идентификаторов и т. Д. .), но не должны копироваться в закрывающий тег.

ОБНОВЛЕНИЕ Я обновил свой ответ для работы с filename.html.erbфайлами.
Я заметил, что мой исходный ответ не работал с файлами, обычно используемыми в представлениях Rails, например, some_file.html.erbкогда я использовал встроенный ruby (например <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]и встроенный стиль с >>.

— Ник Эрхардт
источник

Как быстро закрыть HTML-теги в Vim?

картографирование

Пример использования

объяснение

Проверять, выписываться vim-closetag

Проверять, выписываться `vim-closetag`