В Sublime Text как вы сокращаете написание кода?

9

Приношу свои извинения, но я не знаю, как это называется, если об этом спрашивали или для какого сайта Stack это лучше всего подходит. Я видел несколько видео о том, как люди используют Sublime для создания более быстрых тегов, и я хотел бы узнать, как это сделать, если есть какая-либо документация или что я могу сделать быстрее в своем коде.

В нескольких видео я вижу людей, которые делают такие вещи, как:

div.classи это создаст <div class="class"></div>после tab.

sublime-text-2 DᴀʀᴛʜVᴀᴅᴇʀ
источник
Вы также можете создавать свои собственные фрагменты; docs.sublimetext.info/en/latest/extensibility/snippets.html
Абдесамад Идрисси,
Приведенная выше ссылка больше не действительна. Есть ли официальная ссылка, в которой указано, как создавать наши собственные фрагменты?
anjanesh

Ответы:

11

Функция, которую вы описываете, является частью Sublime Text 2 из коробки. Убедитесь, что ваш документ использует синтаксис HTML ( Просмотр »Синтаксис» HTML ).

Напечатай foo.bar, нажми Tab, и ты получишь <foo class="bar"></foo>. Там тоже foo#bar(ибо idвместо class). Оба реализованы в .Packages/HTML/html_completions.py

Даниэль Бек
источник
Есть ли документация о том, как создавать aтеги и что-то вроде liтегов? Это только для HTML? и +1.
DᴀʀᴛʜVᴀᴅᴇʀ
@Gramps Не знаю, что вы имеете в виду, но обратите внимание, что я указал сценарий, в котором реализована эта функция (выберите пункт меню Обзор пакетов ..., чтобы перейти в каталог, который я упомянул). Вы можете, например, расширить существующий скрипт, например, для поддержки дополнительных разделителей. Сценарии Sublime Text 2 реализованы в Python, вот документация по Python , и эта страница содержит документацию, относящуюся к Sublime Text 2.
Даниэль Бек
Я видел, как кто-то делает, div#main.containerно Sublime выплевывает mainэлемент с классом, containerкогда я пытаюсь?
Тако
7

Emmet / Zen-Coding

Emmet - это плагин, в котором вы пишете базовую структуру в стиле CSS-селектора, и редактор ее расширяет. Вы можете найти пакет на GitHub и установить его через менеджер пакетов.


(источник: smashingmagazine.com )

У этого Smashing Magazine есть статья об этом . Например,

(.foo>h1)+(.bar>h2)

будет расширяться с Tabк

<div class="foo">
  <h1></h1>
</div>
<div class="bar">
  <h2></h2>
</div>

Обтекание выбора в тегах

Что вы также можете сделать, это нажать, AltShiftWчтобы создать открытый тег или обернуть текущее выделение в тег (см. Правка »Тег» Обтекание текущего выделения в теге ).

По умолчанию это создаст:

<p></p>

с выбранным именем тега, чтобы вы могли перезаписать его.

Нажатие Tabприведет вас к тегу. Или, если вы нажмете Space, вы можете создать атрибуты, например:

  • AltShiftW(в Windows / Linux) или CtrlShiftWв OS X
  • A
  • Space
  • Тип href="...", тогдаTab
  • Результаты <a href="..."></a>с курсором, расположенным внутри тега
slhck
источник