Emmet для notepad: Установка Emmet на Notepad++.

Содержание

Notepad++ ускоряем написание кода – Emmet плагин — Блог Анатолия Бузова

22 августа, 201830 января, 2018

Emmet – довольно полезный плагин редактора Notepad ++. Для чего нужен плагин Emmet редактора Notepad++ ? Плагин используется для ускорение написания HTML и CSS кода. А именно – вы пишите короткий код, нажимаете заданное сочетание клавиш и код разворачивается в полноценный.

В начале проверим, установлен ли плагин Emmet, для этого откроем вкладку Плагины. Если данный плагин не установлен зайдем в менеджер плагинов (plugin manager) и установим его: Плагины — Менеджер плагинов — Emmet — Установить. Плагин активируется после перезагрузки редактора.

На самом деле к плагину Emmet для Notepad++ нужно привыкнуть, так как сразу короткие коды писать нелегко, но запомнив сокращения кода, процесс написания руками облегчается в разы.

Когда плагин Emmet для Notepad++ установлен, определим сочетание клавиш для «разворачивания» кода. Идем в Опции (Option) – Горячие клавиши (Hotkeys) – Команды плагинов (Plugin commands). Далее ищем две команды:

Expand abbreviation (развернуть аббревиатуру),
Wrap width abbreviation (завернуть аббревиатуру).

Я задал сочетания клавиш Alt+Q и Alt+W соответственно. Теперь самое интересное. Для примера наберем в редакторе аббревиатуру (по сути, сокращенный код), вот как это работает. Например, нам нужно быстро создать нумерованный список с пятью элементами, набираем:

ol>li*5

Нажимаем Ctrl+Enter

Это небольшая конструкция наглядно демонстрирует возможности плагина Emmet.

А теперь вашему вниманию предоставляется краткий справочник сокращений плагина Emmet редактора Notepad++:

Дочерний элемент: > . Пример:

div>table>tr>td

Каждый следующий тег будет дочерним для предыдущего (вложенным). bq

Перемещает элементы до знака выше, чем элементы после.

<div>
<p></p>
<span></span>
</div>
<blockquote></blockquote>

Группировка (). Пример: div>(header>ul>li)+footer>p

Группирует элементы.

<div>
<header>
<ul>
<li></li>
</ul>
</header>
<footer>
<p></p>
</footer>
</div>

Умножение: *. Пример: ol>li*4

Задает необходимое количество тегов.

<ol>
<li></li>
<li></li>
<li></li>
<li></li>
</ol>

Нумеровать: $. Пример:

ul>li#style_$*3

Нумерует элементы.

<ul>
<li></li>
<li></li>
<li></li>
</ul>

Автоматизация кода в Notepad++ с помощью плагина Emmet

Вступление
Селекторы в Emmet
Примеры комбинации сокращений и селекторов Emmet
Изменение «горячих» клавиш развертывания сокращений

Вступление

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

Установка осуществляется через менеджер плагинов, выбираем «Emmet» и устанавливаем.

Пробуем работает плагин или нет, для этого набираем img (курсор оставляем сразу за img) и нажимаем

Ctrl + Alt + Enter (о там как изменить сочетание клавиш читайте в конце страницы).

Если появился код как показано в примере 1, то на этом установка закончена, плагин работает


Пример 1Набираем: 
img
Получаем:
<img src="" alt="">

Однако, например у меня ничего сразу не получилось. То есть, установка плагина Emmet, эта та еще морока, если просто прочитал и начал устанавливать. Не помогла ни перестановка самого плагина, ни перестановка всего Notepad++.

После чтения различных форумов и статей, лично мне помогла установка отдельным файлом плагина скриптов Python для Notepad++, для тех кто будет искать файл в сети, называется он PythonScript_1.0.8.0.msi. После установки этого плагина, Emmet наконец заработал.делает переход на уровень вверх

*умножает элементы$заменяется числом, увеличивающимся на единицу$$то же самое, что и в п. 09 — только двухзначное{ }добавляет текстовое содержимое элементам( )группирует элементы:для элементов таких как <input>, <a>, <link> и др. — задает атрибуты

Примеры комбинации сокращений и селекторов Emmet

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

Таблица с классом ABCD, включая название и шапку, с семью столбцами и тремя строками. tr*3>td{$}+td*6 Получаем: <table> <caption></caption> <tr> <th>1</th> <th>2</th> <th>3</th> <th>4</th> <th>5</th> <th>6</th> <th>7</th> </tr> <tr> <td>1</td> <td></td> <td></td> <td></td> <td></td> <td></td> <td></td> </tr> <tr> <td>2</td> <td></td> <td></td> <td></td> <td></td> <td></td> <td></td> </tr> <tr> <td>3</td> <td></td> <td></td> <td></td> <td></td> <td></td> <td></td> </tr> </table>
Часто при верстке требуется набор слов, чтобы просто заполнить блоки текстом для визуального представления страницы, при этом смысл текста абсолютно не важен, так называемая «рыба».
C Emmet сделать это легко и просто, для этого нужно набрать слово Lorem и указать необходимое количество слов.
```
Пример 3Набираем:
Lorem10
Получаем:
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Aperiam, nesciunt.
```

Изменение «горячих» клавиш развертывания сокращений

Стандартное сочетаний клавиш развертывания сокращений, мне показалось не очень удобным, поэтому оно было изменено (см. рисунок 1).

рисунок 1

Тем более, что это занимает минимум усилий и времени.

Идем в Меню — Опции — Горячие клавиши
В открывшемся окне переключаемся на вкладку «Plugin commands» и ищем там строку «Expand abbreviations», кликаем по ней мышью, и в новом окне устанавливаем нужное (см. рисунок 2).

рисунок 2

Как установить плагин emmet

Ваш браузер не поддерживает JavaScript. В результате ваши впечатления от просмотра будут уменьшены, и вы будете переведены в режим только для чтения .

Загрузите браузер, поддерживающий JavaScript, или включите его, если он отключен (например, NoScript).

Эта тема была удалена. Его могут видеть только пользователи с правами управления темами.

Я устанавливаю последнюю версию np++.
Вручную установить менеджер подключаемых модулей. (Создал папку «pluginmanager» в папке np++ и скопировал в dll).
Запустите менеджер плагинов и установите плагин emmet.
(Установлены emmet и pyton).
Чем запросить перезагрузку np++.
После перезапуска np++ вышло окно с ошибкой:
http://i. piccy.info/i9/385b02d2bb9101343e6b4046618c4264/1553608476/11102/1309750/2.gif
@Александра-Руденко
старый менеджер плагинов не совместим с более новыми версиями notepad++.
, пожалуйста, не используйте диспетчер плагинов в notepad++ версии 7.6 и выше, так как он будет записывать файлы в неправильные места.
сначала отмените все изменения, внесенные вами в установку notepad++, удалив менеджер плагинов и удалив все, что вы могли установить с помощью менеджера плагинов.
убедитесь, что вы не видите никаких сообщений об ошибках при запуске notepad++, и убедитесь, что вы не видите менеджер плагинов в вашем меню плагинов больше.
далее следуйте >>> Руководству: Как установить плагин PythonScript на Notepad++ 7.
6.3, 7.6.4 и выше <<<, чтобы установить pythonscript вручную.
, затем загрузите подключаемый модуль emmet emmet-npp.zip из >>> здесь <<< и распакуйте его.
перейдите в меню notepad++ 7.6.4 плагины > откройте папку плагинов , чтобы открыть папку плагинов, и создайте новую папку с именем ЭмметАЭС .
скопируйте EmmetNPP.dll из извлеченного emmet-npp.zip в созданную вами папку EmmetNPP .
скопируйте все файлы и папки из папки EmmetNPP из извлеченного emmet-npp.zip в созданную вами папку EmmetNPP .
примечание: ваша папка plugins\EmmetNPP теперь должна содержать EmmetNPP.dll , _PyV8.pyd , editor.js , npp_emmet.py , PyV8.py и папку с именем emmet .
теперь перезапустите блокнот ++, и вы увидите как плагин emmet, так и плагин скрипта python в меню плагинов.
Версия плагина emmet, загруженная отсюда, подходит только для 32-битной ОС
добро пожаловать в сообщество Notepad++, @Tanveer-Malik
Версия плагина emmet, загруженная отсюда, подходит только для 32-битной ОС
да, официальный плагин emmet notepad++ известен только как 32-битный.
, если вам нужен emmet, установите 32-битную версию notepad++, которая будет нормально работать на 64-битной ОС Windows.
в качестве альтернативы вы можете попробовать использовать экспериментальную, неофициальную, 64-битную версию, скомпилированную пользователем, из >>> здесь <<<.
Если вам нужна дополнительная базовая информация о плагине emmet notepad++, посетите также
трекер проекта плагина emmet: https://github.com/emmetio/npp/issues
и страницы документации emmet: https://docs.emmet.io
имейте в виду, что проект emmet не очень хорошо поддерживается, и доступная документация emmet может быть устаревшей.
@Meta-Chuh
Где новый менеджер плагинов?
@Marcin-Po
новая встроенная замена менеджера плагинов называется Plugins Admin и находится в меню Плагины > Администрирование плагинов. .. , как показано на скриншоте ниже.
примечание: администратор плагинов не содержит все плагины, так как некоторые из них не были добавлены в официальный список плагинов notepad++ разработчиком плагина.
Я вижу только «Открыть папку плагинов…» (Notepadd++ 7.6.4 или 7.6.5)
@Marcin-Po сказал:
Я вижу только «Открыть папку плагинов…» (Notepadd++ 7.6.4 или 7.6.5)
Обычно так бывает при нестандартном способе установки. Вы использовали установщик или портативную версию zip/7z/minimalist? Если установщик, вы его ставили в обычное место или указали другой каталог? Если портативный, в какой каталог вы его поместили?
(Также перейдите в меню Notepad++ ?> Информация об отладке > Скопируйте информацию об отладке в буфер обмена и вставьте в свой ответ — это покажет нам, что Notepad++ может видеть о своей среде)
Я использовал установщик и нормальное расположение.
Notepad++ v7.6.5 (32-разрядная версия)
Время сборки: 29 марта 2019 г. — 02:46:18
Путь: C:\Program Files (x86)\Notepad++\notepad++.exe
Режим администратора: ВКЛ
Режим локальной конференции : OFF
ОС : Windows 7 (64-разрядная)
Плагины : DSpellCheck. dll EmmetNPP.dll mimeTools.dll NppConverter.dll NppExport.dll PythonScript.dll
@Marcin-Po сказал:
Я использовал установщик и нормальное расположение.
Спасибо.
Я думаю, что с этими ответами вы увидите администратора плагинов.
Я вижу, что вы находитесь в режиме администратора. Я не думаю, что это повлияет на доступность администратора плагинов. С моим портативным компьютером я могу работать в режиме администратора и по-прежнему видеть администратор плагинов. Возможно, @Meta-Chuh или кто-то другой с уже доступной установленной версией может подтвердить, что режим администратора работает с администратором плагинов на 32-разрядной версии 7.6.5.
О, интересно, что-то напутано в программе обновления GUP. Можете ли вы дать нам вставку из каталога c:\program files (x86)\noteapd++\updater ? чтобы мы могли видеть, есть ли у вас все файлы, необходимые для внутреннего средства обновления (на которое полагается администратор плагинов, IIRC).
привет @Marcin-Po @PeterJones et al.
да, администратор плагинов notepad++ появится и будет работать в режиме администратора.
режим администратора будет активирован автоматически, если контроль доступа пользователей Windows (UAC) отключен, и вы увидите Notepad++ [Администратор] в строке заголовка Notepad++.
одна вещь, которая может вызвать то, что вы видите, это отсутствие списка плагинов.
перейдите в плагины > откройте папку плагинов. .. и найдите папку с именем Config . он должен содержать файл с именем nppPluginList.dll , который содержит список подключаемых модулей.
, если он отсутствует, переустановите notepad++ 7.6.5. 32 бит поверх существующего блокнота++ с помощью установщика отсюда:
https://notepad-plus-plus.org/repository/7.x/7.6.5/npp.7.6.5.Installer.exe
(удаление существующего блокнота++ не требуется)
важно : когда вы переустанавливаете блокнот ++ поверх существующего блокнота ++, убедитесь, что параметры установщика плагины и плагины администратора включены.
@PeterJones сказал:
О, интересно, что-то не так в программе обновления GUP. Можете ли вы дать нам вставку из каталога c:\program files (x86)\noteapd++\updater? чтобы мы могли видеть, есть ли у вас все файлы, необходимые для внутреннего средства обновления (на которое полагается администратор плагинов, IIRC).
gpup.exe
GUP.exe
libcurl.dll
ЛИЦЕНЗИЯ
README.md
@Meta-Chuh сказал:
важно: когда вы переустанавливаете блокнот++ поверх существующего блокнота++, убедитесь, что в настройках установщика включены плагины и администратор плагинов.
Переустановка ничего не дает, но пробовал переустановить без плагинов и плагинов админа, и еще раз с этими опциями и работает!
org/Comment»>
У меня установлен плагин emmet, как описано в инструкции.
Но при выборе в меню плагина «Расширить аббревиатуру» np++ вылетает ошибка.
http://i.piccy.info/i9/8c542a9158620c5df8f24c3e61c3f758/1554642244/8420/1309750/plugin_exception_pyton_1.gif
http://i.piccy.info/i9/eadf8d0a80d8beeb9feb034c72bbbee6/1554642290/6704/1309750/emmet_2.gif
@Александра-Руденко
перейдите в меню блокнота ++ плагины > откройте папку плагинов , чтобы открыть папку плагинов, и откройте папку EmmetNPP .
проверьте наличие файлов _PyV8.pyd , editor.js , npp_emmet.py , PyV8.py и папки с именем emmet .
, если нет, скопируйте их из папки EmmetNPP внутри emmet-npp.zip .
если все на своих местах, то расширить аббревиатуру будет вести себя так, как показано на скринкасте ниже:
@Meta-Chuh
Это новый плагин ComparePlus ?
Те же ошибки.
http://i.piccy.info/i9/8c542a9158620c5df8f24c3e61c3f758/1554642244/8420/1309750/plugin_exception_pyton_1.gif
http://i. piccy.info/i9/eadf8d0a80d8beeb9feb034c72bbbee6/1554642290/6704/1309750/emmet_2.gif
http://i.piccy.info/i9/767e2c0f496d0ceaac5e43f1721da3a0/1554804918/72997/1309750/explorer.gif
@andrecool-68
да, хорошо подмечено.
это грядущий ComparePlus от @pnedev
(также небесный создатель плагинов > открыть папку плагинов... 😉)
большие и потрясающие новые изменения и функции по сравнению со старым плагином сравнения, такие как дифференциальный красный/зеленый выделение в diff строках для удаленного/добавленного текста вместо одного цвета и многое другое. 👍
org/Comment»>
@Meta-Chuh
В PluginAdmin я вижу только одно Compare …ComparePlus нет)
@Alexander–Rudenko
Вставьте свои фотографии на форум таким образом
![](http://i.piccy.info/-x-x-.gif)

Эммет не работает | Блокнот++ Сообщество

Ваш браузер не поддерживает JavaScript. В результате ваши впечатления от просмотра будут уменьшены, и вы были помещены в режим только для чтения .

Загрузите браузер, поддерживающий JavaScript, или включите его, если он отключен (например, NoScript).

Эта тема была удалена. Его могут видеть только пользователи с правами управления темами.

Установлены Notepad++ (7.5.8.) и Emmet 64bit (1.0.0.)
Однако команды в Plugins/Emmet/xxxx не работают.
Как это исправить?
Откуда вы установили Emmet 64bit? Судя по https://github.com/emmetio/npp#readme, такой версии нет.
https://github.com/emmetio/npp/issues кажется правильным местом, но, похоже, уже существуют 64-битные проблемы.
org/Comment»>
скачано с http://emmet.io
@Jan-Kijlstra
Единственный плагин Emmet, который я вижу на этом сайте, — 32-битный.
@Jan-Kijlstra ,
Я тоже вижу только 32-битный.
Если я перейду по указанному вами URL-адресу, а затем перейду на страницу загрузки, а затем на страницу Notepad ++, мне потребуется https://github.com/emmetio/npp#readme. Оттуда я нажимаю «Загрузить EmmetNPP», что дает мне 32-битную DLL.
Если вы попытаетесь установить 32-битную DLL в 64-битный Notepad++, это не сработает. Далее, если бы вы смогли найти 64-битный плагин EmmetNPP и установить его на 32-битную АЭС, он тоже не сработал бы.
Не могли бы вы перейти к вашему Notepad++ ? , выберите Информация об отладке и скопируйте информацию об отладке в буфер обмена и вставьте ее сюда? Если ваша копия Notepad++ способна распознать подключаемый модуль Emmet, он будет указан в списке подключаемых модулей . Если нет, то либо они несовместимы (32-разрядная и 64-разрядная, либо из-за каких-то других изменений, которые происходят… тем более, что Дон Хо, похоже, реструктурирует, где будут располагаться плагины).
Ой, подождите, вы же намекнули, что можете видеть Плагины> Меню Emmet с xxxx элементами… это, вероятно, означает, что что-то в том, как работает EmmetNPP, несовместимо с тем, как сейчас работает Notepad++. Возможно, вы захотите попробовать вернуться к паре версий Notepad++ и посмотреть, исправит ли это ситуацию. Если это так, вам нужно создать проблему с EmmetNPP, потому что им, возможно, придется что-то изменить, чтобы оставаться совместимым с NPP в будущем. (На самом деле кажется, что кто-то уже отправил отчет об ошибке 64-битной версии на https://github.com/emmetio/npp/issues/24 — о, это явно проблема 32-битной и 64-битной версии.)
Тем не менее, дайте нам Debug Info , и, если вы действительно 64-битный, где именно вы скачали 64-битную DLL.
Вот он:
Notepad++ v7.5.8 (64-разрядная версия)
Время сборки: 23 июля 2018 г. — 02:06:36
Путь: C:\Program Files\Notepad++\notepad++.exe
Режим администратора: ВЫКЛ
Режим локальной конференции: ВЫКЛ.
ОС: Windows 10 (64-разрядная версия)
Плагины: EmmetNPP. dll PluginManager.dll PythonScript.dll XMLTools.dll DSpellCheck.dll mimeTools.dll NppConverter.dll
Rgds
Январь
куда именно вы скачали 64-битную DLL
@Jan-Kijlstra
Вы забыли ответить на запрошенную информацию выше
Извините, будучи новым пользователем, мне пришлось ждать 1200 секунд, прежде чем
смог ответить (довольно глупо, имхо, отталкивать новых членов сообщества).
Вот где я это нашел:
https://github. com/emmetio/npp/issues/19
Это в сообщении wdhwg001
Там ссылка на EmmetNPP_x64.zip
@Jan-Kijlstra
пришлось ждать 1200 секунд, прежде чем он смог ответить (довольно глупо, имхо, отталкивать новых членов сообщества).
Никого (пытаясь) не отталкивать, кроме спамеров. У вас не должно быть задержек с публикацией, так как я дал вам 2 очка репутации.
Спасибо.
org/Comment»>
@Jan-Kijlstra
какую версию плагина скрипта Python вы используете, недавно произошли некоторые изменения.
Можете ли вы предоставить воспроизводимое пошаговое описание того, что не работает
Ура
Клаудия
Сценарий Python 1.2.0.0
Я запускаю Notepad++, и в меню плагинов есть подключаемый модуль Emmet Notepad++.
Итак, в Notepad++ я ввожу div, а затем Ctr+Alt+Enter.
Что открывает новую пустую строку над тегом.
Но не
,