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

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

110 голосов
/ 25 сентября 2008

Прошло много времени с тех пор, как мне пришлось делать любой HTML-подобный код в Vim, но недавно я снова столкнулся с этим. Допустим, я пишу несколько простых HTML: 

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

Как быстро написать эти закрывающие теги для заголовка, заголовка и HTML? Я чувствую, что упускаю какой-то очень простой способ, который не требует, чтобы я записывал их все по одному.

Конечно, я могу использовать Ctrl P для автозаполнения имен отдельных тегов, но на клавиатуре моего ноутбука я получаю правильные скобки и косую черту.

Ответы [ 11 ]

73 голосов
/ 25 сентября 2008

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

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

  2. Если вы сразу же наберете другой > ( например, вы наберете <p>>), он расширит это до

    <p>

    </p>

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

Плагин xml vim добавляет свертывание кода и соответствие вложенных тегов этим функциям.

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

55 голосов
/ 10 февраля 2009

Мне нравятся минимальные вещи, 

imap ,/ </<C-X><C-O>
45 голосов
/ 27 сентября 2008

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

span|

нажмите CTRL + x ПРОБЕЛ

и вы получите 

<span>|</span>

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

<span>
|
</span>

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

38 голосов
/ 25 сентября 2008

Проверьте это ..

closetag.vim 

Functions and mappings to close open HTML/XML tags

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

Я использую нечто подобное.

23 голосов
/ 14 декабря 2010

Если вы делаете что-то сложное, sparkup очень хорошо.

Пример с их сайта:

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>
17 голосов
/ 08 декабря 2011

Существует также плагин 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>
  ---------------------
10 голосов
/ 12 августа 2012

Mapping

Мне нравится, когда мои теги блоков (в отличие от встроенных) закрываются немедленно и с помощью как можно более простого сочетания клавиш (мне нравится избегать специальных клавиш, таких как CTRL , где это возможно, хотя я использую closetag.vim чтобы закрыть мои встроенные теги.) Мне нравится использовать этот ярлык при запуске блоков тегов (благодаря @kimilhee; это ответ на его вопрос): 

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

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

1011 * Тип-* 

<p>[Tab]

result- 

<p>
 |
</p>

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

Объяснение

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

allml (теперь Ragtag) и Omni-завершение ( ) не работает в таких файлах, как .py или .java.

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

imap <C-j> <ESC>F<lyt>$a</^R">

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

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

ABCDE |

и введите ^ j

затем закройте тег, как это ..

ABCDE

|
5 голосов
/ 24 февраля 2017

Выезд vim-closetag

Это действительно простой скрипт (также доступен как плагин vundle), который закрывает (X) HTML-теги для вас. Из него README:

Если это текущий контент: 

<table|

Теперь вы нажимаете > , содержимое будет: 

<table>|</table>

А теперь, если вы снова нажмете > , содержимое будет: 

<table>
   |
</table>

Примечание: | здесь курсор

5 голосов
/ 26 октября 2012

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

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

    :iabbrev </ </<C-X><C-O>

  2. Включение завершения

    autocmd FileType xml set omnifunc=xmlcomplete#CompleteTags

Страница:
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...