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

https://stackoverflow.com/questions/130734

02-07-2019
|

Вопрос

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

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

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

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

Решение

Посмотри на это..

closetag.vim

Functions and mappings to close open HTML/XML tags

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

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

Другие советы

Я нахожу, что использование xml - файл плагин довольно полезный.это добавляет две части функциональности:

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

<p>

</p>

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

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

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

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

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

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

span|

Пресса CTRL+x Космос

и вы получаете

<span>|</span>

Вы также можете использовать CTRL+x ВОЙТИ вместо того, чтобы CTRL+x Космос, и вы получаете

<span>
|
</span>

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

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

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

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>

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

Отображение

Мне нравится, чтобы мои теги блоков (в отличие от встроенных) закрывались немедленно и с помощью как можно более простого сочетания клавиш (мне нравится избегать специальных клавиш, таких как 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> означает начните новую строку в режиме вставки над курсором и вставьте пробел

allml (теперь Ragtag) и Omni-completion ( <C-X><C-O> ) не работают в таких файлах, как .py или .java.

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

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

( ^R - это Contrl+R :вы можете ввести следующим образом Control + v, а затем Control + r )

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

<p>abcde|

и введите ^j

затем он закрывает тег следующим образом..

<p>abcde</p>|

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

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

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

autocmd FileType xml set omnifunc=xmlcomplete#CompleteTags

Проверьте `vim-closetag`

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

Если это текущий контент:
<table|
Теперь вы нажимаете >, содержание будет:
<table>|</table>
И теперь, если вы нажмете > опять же, содержание будет следующим:
<table>
   |
</table>

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

Основываясь на отличном ответе @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>

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

И в качестве примера добавления закрывающего тега inline вместо block style:

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

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

Тип:

<div class="foo">[Tab]

Результат:

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

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

Это правда, что оба приведенных выше примера опираются на >[Tab] чтобы указать закрывающий тег (это означает, что вам нужно будет выбрать либо встроенный или блочный стиль).Лично я использую блочный стиль с >[Tab] и встроенный стиль с >>.

Лицензировано под: CC-BY-SA с атрибуция

Не связан с StackOverflow

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

Отображение

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

Объяснение

Проверьте vim-closetag

Проверьте `vim-closetag`