Вопрос №67615 от пользователя Елена Полтанова в уроке «Emmet», курс «Основы современной верстки»
Все топики
Елена Полтанова
Здравствуйте! https://ru.hexlet.io/code_reviews/595786 В Atom с плагином Emmet код преобразуется точь-в-точь как в ТЗ, но при проверке выдается ошибка, которую я не могу интерпретировать. Подскажите, в чем дело?
2 0
Nikita Mikhaylov
Здравствуйте
Думаю Atom просто смог быстро сделать «работу над ошибками». Тесты пытаются сказать, что не могут распознать строку из-за ошибки в районе 122 символа. Там происходит вот это: place-of-study-$*3{Место учёбы №$}*3. Дело в том, что вы уже указали сделать три раза элемент place-of-study и дополнительное указание умножения для текста не требуется
0
Елена Полтанова
Благодарю за подсказку, все получилось!
0
- Задавайте вопросы по уроку
- Проверяйте знания в квизах
- Проходите практику прямо в браузере
- Отслеживайте свой прогресс
Зарегистрируйтесь или войдите в свой аккаунт
Рекомендуемые программы
Профессия
с нуля
Фронтенд-разработчик
Разработка фронтенд-компонентов для веб-приложений
23 марта 10 месяцев
Профессия
Новый с нуля
Онлайн-буткемп.
Фронтенд-разработчик
Интенсивное обучение профессии в режиме полного дня
20 апреля 4 месяца
Профессия
с нуля
Python-разработчик
Разработка веб-приложений на Django
23 марта 10 месяцев
Профессия
с нуля
Java-разработчик
Разработка приложений на языке Java
23 марта 10 месяцев
Профессия
с нуля
PHP-разработчик
Разработка веб-приложений на Laravel
23 марта 10 месяцев
Профессия
с нуляИнженер по тестированию
Ручное тестирование веб-приложений
23 марта 4 месяца
Профессия
с нуля
Node.js-разработчик
Разработка бэкенд-компонентов для веб-приложений
23 марта 10 месяцев
Профессия
с нуля
Fullstack-разработчик
Разработка фронтенд- и бэкенд-компонентов для веб-приложений
23 марта 16 месяцев
Профессия
c опытом
Разработчик на Ruby on Rails
Создание веб-приложений со скоростью света
23 марта 5 месяцев
Профессия
с нуля
Верстальщик
Верстка с использованием последних стандартов CSS
в любое время 5 месяцев
Профессия
с нуля
Аналитик данных
Сбор, анализ и интерпретация данных
дата определяется 9 месяцев
10 лучших плагинов для Atom
Меня часто спрашивают какие плагины использую я для atom, так как я снимаю в нем видео.
Итак первым идет Auto close html Он закрывает открытый тег, что очень удобно. Если вы пишете html, то однозначно надо ставить.
Autocomplete+ path Это автодополнение для файлов. В atom есть несколько стандартных пакетов для автодополнения, но этот в стандартные пакеты почему-то не вошел. Он решает огромную проблему. Вам не нужно пропечатывать файлы руками и помнить точные названия.
Docblockr — пакет для легкого написания документации. Я использую JSDoc вместе с ним и он отлично генерирует заготовки для документации на основе функций, перед которыми вы его ставите. Вы пишете функцию, нажимаете /** и вам генерируется заготовка.
EditorConfig — этот пакет я бы поставил под номером один для каждого разработчика в команде. EditorConfig — это специальный файл, который кладется в рут проекта и где указывают отступы для разных типов файлов. Этот пакет есть почти для любого редактора и сразу подхватывает отступы принятые в проекте.
file-icons — красивые иконки для редактора. Они сильно упрощают нахождение файлов визуально по типам.
Highlight Selected — даблклик по слову подсвечивает все нахождения этого слова в тексте. Единственное, что непонятно, почему он не устанавливается в атом по умолчанию
Javascript snippets — это набор сниппетов для javascript, которые упрощают набор кода, который вы пишете каждый день. Например cl напишет console.log, а de — debugger.
Jsx — если вы используете jsx или react + jsx. Для правильных отступов в js файлах вам обязательно нужен этот пакет
linter — это мой второй самый любимый пакет. Это базовый линтер, который показывает ошибки в файлах. Его можно расширять, добавляя разные линты для разных языков. Например вы можете добавить eslint, если вы пишете javascript. Тогда прямо при вводе текста вам будут подсвечиваться ошибки, соответственно вашим настройкам eslint. Кстати урок по eslint я снимал совсем недавно и советую обязательно посмотреть.
pigments — отличный пакет для подсветки цветов в css файлах.
Дает явное представление как выглядит цвет не открывая браузер.
project plus — если у вас больше одного проекта, то у вас явно возникал вопрос, как между ними переключаться не открывая 10 вкладок. Project-plus решает именно эту проблему. Вы сохраняете папку как проект и задаете название. И потом можете в 2 клика переключаться с проекта на проект
sync settings — ну и самый важный пакет, это sync-settings. Потому что когда вы установили все эти пакеты на одну машину, то вы не хотите в следующий раз опять искать их и устанавливать все с ноля на другой машине. В этом пакете можно указать gist файл на гитхабе и в него будет синхронизироваться список пакетов и настройки атома. Тогда для разворачивания атома на другой машине вам понадобится пара секунд.
Я надеюсь, что эти пакеты помогут вам настроить Atom лучше.
Обязательно пишите в комментариях, какие пакеты для atoma используете вы.
Активировать emmet в Atom.io –
спросил
Изменено 2 года, 7 месяцев назад
Просмотрено 12 тысяч раз
Я использую новую установку редактора атомов и только что установил emmet.
Но когда я набираю, например:
дел.abcde
и нажмите TAB, ничего не происходит.
Я что-то забыл активировать?
- эммет
- атом-редактор
1
В атоме 1.3.1 (может работать для более старых версий, я почти уверен)
1. Просто нажмите
ctrl+shift+L
или в Меню: Правка -> Выбрать грамматику.
2. Убедитесь, что вы выбрали правильную грамматику, например: HTML в вашем случае. Я только что узнал, что это была моя проблема, теперь все работает отлично.
5
Я думаю, что вам нужно перезапустить редактор атома для работы с Emmet или любым другим пакетом. это поможет вам.
0
В Windows у меня работает с помощью ctrl+e;
Я набрал div.
alert.alert-success , наконец, я нажимаю ctrl+e, после чего мне выдается
0
У меня была похожая проблема — это было из-за того, что HTML (Angular) был установлен в качестве средства проверки языка по умолчанию для файлов html. Изменил его на просто «HTML», и он работает как шарм!
Открытый атом
Option File -> Keymap —-> и вставьте в конце.
'atom-text-editor: not ([mini])': 'tab': 'emmet: развернуть аббревиатуру с вкладкой'
Сохранить и ок.
Перезапустите Atom и готово,
Tabвозвращается к работе с Emmet
1
Нажмите
ctrl + alt + enter
перейдите в режим Expand Abbreviation (интерактивный) и Подтвердите свою команду.
Например,
div.Затем просто введите TAB (клавиша по умолчанию)
Если не работает откройте File->Keymap-> то вставьте этот
‘атом-текстовый редактор: не ([мини])’: ‘вкладка’: ’emmet:расширить-аббревиатуру-с-вкладкой’
и сохраните его.
Новая версия emmet может иметь более легкий доступ к стандартному коду.
Таким образом, при вводе html без сокращения просто нажмите Enter вместо вкладки , а затем html. Это сработало для меня.
Зарегистрируйтесь или войдите в систему
Зарегистрируйтесь с помощью Google
Зарегистрироваться через Facebook
Зарегистрируйтесь, используя адрес электронной почты и пароль
Опубликовать как гость
Электронная почта
Обязательно, но не отображается
Опубликовать как гость
Электронная почта
Требуется, но не отображается
html — Emmet на атоме не работает должным образом
спросил
Изменено 5 месяцев назад
Просмотрено 12 тысяч раз
Привет, я использую Emmet в редакторе кода Atom , и он отлично работает только с простыми тегами, такими как 
Тем не менее, когда я пробую что-то сложное, например, ul>li*5 или meta[property=""] , а затем нажимаю Tab, ничего не происходит.
Кто-нибудь знает, как это исправить?
- html
- атом-редактор
- emmet
3
Это случилось и со мной, проблема в том, что одна и та же горячая клавиша (вкладка) настроена на несколько действий, поэтому я решил отредактировать действие расширения следующим образом.
перейдите в Настройки > Пакеты > Поиск Emmet… на сочетаниях клавиш откройте последнюю вкладку и нажмите на значок копирования
[]<- (что-то вроде этого)
, затем перейдите в Edit > Keymap… и скопируйте туда следующий
'atom-text-editor: не([мини])': 'ctrl-alt-shift-c': 'emmet:expand-abbreviation'
Поскольку раскладка клавиатуры… переопределяет все остальные привязки клавиш, эта будет работать над всеми другими определениями.
Примечание: если вы используете ‘tab’ в качестве привязки клавиш, она будет использоваться только для расширения-emmet, поэтому вы не сможете на самом деле использовать tab__(2spaces) в HTML, PHP, других… файлах
НАДЕЕМСЯ НА ПОМОЩЬ
1
вы обнаружите после установки emmet, завершение табуляции не работает, как описано в документации, перейдите в Atom> Keymap или File> Keymap добавьте следующий код, затем перезапустите Atom (это исправление сработало для меня):
'atom- текстовый редактор: не ([мини])': 'вкладка': 'emmet:расширить-аббревиатуру-с-вкладкой'
Ответ от
https://github.com/emmetio/emmet-atom/issues/503
Мне помогло.
Перейдите в Atom > Keymap или File > Keymap, добавьте следующий код, затем перезапустите Atom.
'атом-текстовый редактор: не ([мини])': 'вкладка': 'emmet:расширить-аббревиатуру-с-вкладкой'
Просто хочу отметить, что, как и в https://stackoverflow.
com/a/65645633/7773582, мне пришлось перезапустить Atom, установленный в Ubuntu Linux Groovy Gorilla, чтобы получить мой собственный keymap.cson для новой привязки клавиш с
' атом-текст-редактор[data-grammar="текст html базовый"]:не([мини]), атом-текст-редактор [грамматика данных ~ = "erb"]: не ([мини]), текстовый редактор атома [грамматика данных ~ = "нефрит"]: не ([мини]), текстовый редактор атома [грамматика данных ~ = "css"]: не ([мини]), текстовый редактор атома [грамматика данных ~ = "стилус"]: не ([мини]), атом-текст-редактор [грамматика данных ~ = "sass"]: не ([мини]), текстовый редактор атома [грамматика данных ~ = "scss"]: не ([мини])': 'shift-enter': 'emmet:расширить-аббревиатуру-с-вкладкой'
, чтобы Emmet-Plugin развернул свой синтаксис для правильной работы.
Любые установленные вами надстройки, скорее всего, не будут работать, если вы не перезапустите приложение.
Если все упомянутые здесь решения не оказывают никакого влияния на ваше приложение Atom, это просто потому, что ваше приложение Atom ВСЕ ЕЩЕ работает в фоновом режиме, даже если вы его закрыли.