Как добавить БЭМ елемент с помощью emmet?

Использую VS Code + emmet + bem.

Как видно с примера, когда я хочу добавить в уже существующий блок елемент с классом .card__inner, то вместо неого получаем блок с модификатором.
5b55904157e33400016074.jpeg5b55904a03a54575883409.jpeg.card__inner+TAB ----> <div class="card card--inner"></div>

Как добавить елемент c классом .card__inner?

И второй вопрос, как добавлять коментарий с помощью |c для определенных тегов, а не для всех которые содержат класс или id?
  • Вопрос задан
  • 1222 просмотра
Пригласить эксперта
Ответы на вопрос 1
motr
@motr
в settings дописать:
"emmet.syntaxProfiles": {
    "html": {
      "filters": "html, bem"
    }
  },
  "emmet.preferences": {
    "bem.elementSeparator": "__",
    "bem.modifierSeparator": "--",
    "bem.shortElementPrefix": "-",
    "lorem.defaultLang": "en"
  },

синтаксис такой:
5b5564f342d49862275625.gif
По поводу второго вопроса, надо курить настройки emmet, а именно фильтры
filter.commentTrigger: - list of attributes that should trigger comment output. Default value is id, class

И в vscode, в "emmet.preferences": {} прописывать то, что вы хотите видеть в комменте
Например:
"emmet.preferences": {
    "filter.commentBefore": "<!-- [#ID][.CLASS] -->\n",
    "filter.commentAfter": "\n<!-- [#ID][.CLASS] end -->"
},

Ещё, чтобы не писать постоянно |c для вывода коммента, можно опять же дописать настройку:
"emmet.syntaxProfiles": {
    "html" : {
      "filters" : "html, c"
    }
},
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы