sitename
Emmet для sublime text 3 установка. Добавление Package Control
11.05.2015 Программы
Mr. Edyan
В закладки

Emmet для sublime text 3 установка. Добавление Package Control

Каждый Веб-разработчик всегда в поиске упрощения своего рабочего места. Эта статья посвящена начинающим верстальщикам которые часто работают с HTML и CSS, при этом пользуются Sublime Text 3.

Плагин "Emmet" облегчит работу с самым популярным текстовым редактором. Помимо Соблайма, Эммет может работать и с другими редакторами, такими как - Notepad++, Coda, Eclipse, TextMate, и Adobe DreamWeaver.

Процесс установки Emmet для Sublime

Когда я устанавливал плагин Эммет на свой редактор, то у меня возникла проблема, для установки мне нужна была вкладка «Package Control» которая должна была находится в «Preferences», ее там небыло, если и у вас нет, то читайте ниже.

Как добавить Package Control в Sublime Text 3

Очень просто и быстро. В редакторе жмите Ctrl+ или View -> Show console а если у вас русифицированный Соблайм то Вид -> Показать/скрыть консоль. После этого откроется панель ввода, вставьте в нижнюю строку код.

import urllib.request,os,hashlib; h = 'df21e130d211cfc94d9b0905775a7c0f' + '1e3d39e33b79698005270310898eea76'; pf = 'Package Control.sublime-package'; ipp = sublime.installed_packages_path(); urllib.request.install_opener( urllib.request.build_opener( urllib.request.ProxyHandler()) ); by = urllib.request.urlopen( 'http://packagecontrol.io/' + pf.replace(' ', '%20')).read(); dh = hashlib.sha256(by).hexdigest(); print('Error validating download (got %s instead of %s), please try manual install' % (dh, h)) if dh != h else open(os.path.join( ipp, pf), 'wb' ).write(by)

 

Установка package control в Sublime

Нажмите Enter и перезапустите ваш редактор.

Установка плагина Emmet для Sublime Text 3

Теперь у нас есть Пакет управления в Саблайме и можно переходить к установки Эммета. Тут тоже делов на минуту. Как вы уже наверное поняли, нужно нажать на «Preferences» (Глобальные параметры) или Ctrl + Shift + P и в самом низу кликнуть на Package Control, у вас всплывет окно, нажимайте на «Install Package» (Установить Пакет) на шестой строке.

После этого всплывет еще одно окно где нужно ввести слово «Emmet», появится много предложений и словосочетаний, нажать нужно на самую первую надпись.

Установка emmet

Вот и все, когда откроется вкладка «Package Control Messages» с содержимым о том что плагин установлен, можно все закрыть, перезапустить и пользоваться!

Как работает плагин Emmet

Приведу пару примеров «Emmet горячие клавиши». Например при написании ul без <> и нажатия Tab будет автоматически развернут полный список.

Горячие клавиши ul и ui

Таким же методом можно написать div.class для назначения класса.

Горячие клавиши div.class

Для первоначального создания страницы достаточно добавить ! и нажать Tab.

Горячие клавиши doctype

Подобных способов довольно много, всех я перечислять не буду, их и так достаточно в Интернете, найти не сложно!

На сегодня все, пока!

Комментарии (46)
Добавить комментарий
Прокомментировать
  1. Alex
    #32 Alex Гость 2017-11-03
    0
    Миша, у меня так и не работает с Тав, по Ctrl + e срабатывает( Хотя и новый файл открывал.
  2. Vadim Chumachenko
    #31 Vadim Chumachenko Участник 2017-10-29
    0
    Подскажите у меня не работает через кнопку ТАБ,только через ctrl+e Как задать чтоб была через ТАБ?
    1. Максим
      #30 Максим Гость 2017-11-01
      0
      Попробуйте в настройках включить HTML-синтаксис, мне помогло.
    2. Максим
      #29 Максим Гость 2017-11-01
      +4
      view > syntax > html
      1. Антон
        #28 Антон Гость 2017-11-20
        0
        Спасибо, сработало
  3. knock off bulgari snake bracelet
    #27 knock off bulgari snake bracelet Гость 2017-10-25
    0
    Hi Rebecca – he might qualify. I cannot know for sure without having a more indepth conversation with you but you are a US citizen and he has not left the US yet – correct? You might benefit from speaking to me or another immigration attorney in Denver about the situation.
    knock off bulgari snake bracelet http://www.vsdws.com/tag/serpenti-bracelet-fake
  4. Никита
    #26 Никита Гость 2017-10-25
    0
    ответьте пожалуйста что делать. пишет Error validating download (got 6f4c264a24d933ce70df5dedcf1dcaeeebe013ee18cced0ef93d5f746d80ef60 instead of df21e130d211cfc94d9b0905775a7c0f1e3d39e33b79698005270310898eea76), please try manual install
    1. Оганес
      #25 Оганес Гость 2017-10-27
      +1
      На официальном сайте (https://packagecontrol.io/installation) есть другой код. У меня тоже такая ошибка валилась.

      import urllib.request,os,hashlib; h = '6f4c264a24d933ce70df5dedcf1dcaee' + 'ebe013ee18cced0ef93d5f746d80ef60'; pf = 'Package Control.sublime-package'; ipp = sublime.installed_packages_path(); urllib.request.install_opener( urllib.request.build_opener( urllib.request.ProxyHandler()) ); by = urllib.request.urlopen( 'http://packagecontrol.io/' + pf.replace(' ', '%20')).read(); dh = hashlib.sha256(by).hexdigest(); print('Error validating download (got %s instead of %s), please try manual install' % (dh, h)) if dh != h else open(os.path.join( ipp, pf), 'wb' ).write(by)
  5. Fara
    #24 Fara Гость 2017-10-01
    +1
    Здравствуйте у меня в компьютер не подключен к интернету ,установить плагин можно как без связи Спасибо заранее
  6. Саша
    #23 Саша Гость 2017-09-27
    +6
    Что от меня хочет эта бездушная махина Error validating download (got 6f4c264a24d933ce70df5dedcf1dcaeeebe013ee18cced0ef93d5f746d80ef60 instead of df21e130d211cfc94d9b0905775a7c0f1e3d39e33b79698005270310898eea76), please try manual install
  7. ,hbnsq
    #22 ,hbnsq Гость 2017-09-15
    +1
    Миша,
    спасибо тебе Потапыч))
  8. Егор
    #21 Егор Гость 2017-09-14
    +1
    где скачать
  9. Антон
    #20 Антон Гость 2017-09-14
    0
    Так же не создает классы после точки!!!
    Но сама табуляция работает
  10. Антон
    #19 Антон Гость 2017-09-14
    0
    Не работает ">" "+" не понимаю почему
  11. Андрей
    #18 Андрей Гость 2017-09-04
    0
    Работа плагина немного отличается от той, которая на скринах. Например, ul, нажимаю таб, и становится <ul></ul>-не как показано на сайте. Помогите
  12. Виталий
    #17 Виталий Гость 2017-09-04
    0
    Спасибо.Очень хорошо пошагово расказали как установить.
  13. Андрей
    #16 Андрей Гость 2017-09-04
    0
    Написано"Закрыть и перезапустить программу", а как перезапускать-то?
    1. Mr. Edyan
      #15 Mr. Edyan Администратор 2017-09-04
      0
      Просто запустите снова.
  14. Геннадий
    #14 Геннадий Гость 2017-09-01
    0
    Большое спасибо за статью, помогла!)
  15. Александ
    #13 Александ Гость 2017-08-29
    0
    скачать прогу с оф сайта 3 версию, а плагин установил как тут пишут и нифига не работает
  16. Юрий Титов
    #12 Юрий Титов Гость 2017-08-27
    -1
    Огромное спасибо
  17. Farrukh
    #11 Farrukh Гость 2017-03-21
    0
    Thanks a lot
  18. Farrukh
    #10 Farrukh Гость 2017-03-21
    0
    Helpful page
  19. Мария
    #9 Мария Гость 2017-02-03
    +5
    Огромное спасибо!!!! Очень полезная статья. Все заработало
    1. Mr. Edyan
      #8 Mr. Edyan Администратор 2017-02-03
      0
      Пожалуйста )))
  20. Юрий
    #7 Юрий Гость 2017-01-23
    +1
    Доброго дня. После ввода кода вылетает вот это: ImportError: No module named request
    Скачал последнюю версию бутстрапа... в чем дело:? Подскажите.
    Спасибо.
  21. Андрей
    #6 Андрей Гость 2016-11-20
    0
    div.class работает и без Emmet
  22. Станислав
    #5 Станислав Гость 2016-10-10
    +3
    установил по инструкции, перезапустил, по кнопке tab работает простое табулирование а не работа плагина
    1. Denis
      #4 Denis Гость 2016-10-11
      0
      Такая же фигня!
      1. Миша
        #3 Миша Гость 2016-10-19
        +3
        у меня тоже самое, но вместо tab работает сочетание Ctrl+e
        1. Миша
          #2 Миша Гость 2016-10-19
          0
          Может кто-нибудь подсказать почему tab не работает?
          1. Mr. Edyan
            #1 Mr. Edyan Администратор 2016-10-19
            +1
            Попробуйте код с официальной страницы https://packagecontrol.io/installation
            1. Миша
              #0 Миша Гость 2016-10-19
              +11
              Спасибо! Понял в чём моя ошибка, сразу в окне программы tab не работает, нужно создать какой-нибудь файл html и уже в нём tab работает нормально.
  23. Владислав
    #-1 Владислав Гость 2016-10-02
    0
    Спасибо.
    Очень все доступно :)
  24. Ромка
    #-2 Ромка Гость 2016-09-13
    +1
    Автору сей спасительной статьи огромное спасибо!
  25. Дарья
    #-3 Дарья Гость 2016-08-03
    0
    На линуксе тоже будет работать?
    1. Mr. Edyan
      #-4 Mr. Edyan Администратор 2016-08-03
      0
      Думаю на операционной системе Linux, Emmet будет работать. https://packagecontrol.io/packages/Emmet
  26. Daria
    #-5 Daria Гость 2016-08-02
    0
    Работает, спасибо!!! Только почему то начальная страница не создается
    1. Mr. Edyan
      #-6 Mr. Edyan Администратор 2016-08-02
      0
      Рад что разобрались в моё отсутствие )))
  27. Daria
    #-7 Daria Гость 2016-08-02
    0
    Подскажите, где посмотреть установленные плагины? может не установился..
  28. Daria
    #-8 Daria Гость 2016-08-02
    0
    все вроде сделала, не работает(
  29. Александр
    #-9 Александр Гость 2016-08-02
    +1
    Большое спасибо! Я ваще в верстке зелёный да и в программировании тоже, короче во всем! :)... всё доходчиво!
  30. Серж
    #-10 Серж Гость 2016-07-06
    +1
    Благодарочка. 3 первыйх сайта ничуть не помогли. На твоем все по полочкам разложено!
  31. TrickBear
    #-11 TrickBear Гость 2016-05-25
    +1
    Thanks bro помог, "красивых" кодов bro :)
  32. Кирилл
    #-12 Кирилл Гость 2016-02-14
    +1
    Здравствуйте, подскажите пожалуйста, перепробовал кучу редакторов, из последних помню Атом, и SM, не могу установить плагины ни на один из них. Выдает ошибку при соединении с серверов. Возможно timout, как решить проблему?
    Спасибо!
    1. Mr. Edyan
      #-13 Mr. Edyan Администратор 2016-02-14
      -1
      Не сталкивался с подобным, не имею понятия как Вам помочь
Войти через: