Support platforms inside block folder #77
Comments
|
I think we should create new scheme which will support platforms. I don't want to add this logic in |
|
I suggest to support |
|
I'm glad we finally get to the |
|
Предлагаю вместо специального разделителя строго типизировать суффиксы: Этот путь мене походит на костыль, чем добавление спорного разделителя. Из обсуждения в Telegram есть возражения:
К примерам "разделения слов внутри имени" можно отнести .deps.js и .post.css это разделения костыли для простоты, избавляющие от дополнительных действий по настройки подсветки в редакторе. Думаю будет не слишком большой список, если состарить список специальных расширений (т.н. зарезервированных слов), наличие такого списка нивелирует проблему сложности отличить одно от другого. |
|
@ilyar Перечитал несколько раз так и не понял как ты хочешь решать подсветку в редакторе и чем не нравится |
|
Я предлагаю добавить строгости и сказать есть extension = tech у которых могут быть алиасы (для упрощения работы в редакторах): entityName.deps === entityName.deps.js Еще есть у нас расширение Еще для примера давайте взглянем на хорошо известный нам подход к архивам В общем я не предлагаю сильно менять то что есть, а просто добавить немного порядка и общего смысла. В этом прядке, определять платформу станет возможным. Я понятно объясняю? |
|
Еще уточню, что знание про алиасы или специальный словарь использовать в реализации детекта сущности и ее технологии (при этом не меняется текущее использование .deps.js, .post.css). Снаружи будет простой и прозрачный интерфейс |
Как по моему так это слабый аргумент. Сейчас Как смотрится хорошо? По мне так не очень. |
|
@ilyar Скорее, p.s. Всё после первой точки это технология, инструменты не умеют |
|
Тут смотрел https://github.com/bem-sdk/bem-walk/blob/master/test/schemes/flat/techs.test.js#L35-L47 разве это не умение? Полагал, что если исходить из и возможность собирать бандлы desktop, ie8, etc (примерно, понятно что это уже за рамками текущей либы). |
|
Просто надо рассматривать ie8 как платформу:
… ***@***.***
|
|
@ilyar Виталя шарит) |
|
Мне норм оба варианта: |
|
Еще один минус схемы без доп. символа это сортировка: |
|
|
|
Буэ |
|
@vithar ты распиши полный набор всех технологий в плоский список для 3х платформ хотя бы, а потом пиши свое буэ ;) |
|
Я вполне представляю оба варианта. |
|
Это чудесно, но было полезно увидеть обоснование к буэ) Или это просто личное ощущение? |
|
Думаю, что надо делать так: # Схема с суффиксами
entityName/entityName.css
entityName/entityName.js
entityName/[email protected]
entityName/[email protected]
entityName/[email protected]
entityName/[email protected]
# Схема с папками
# (ну или без @, но тогда есть вопросы как определять что это платформа, а не хрень)
entityName/entityName.css
entityName/entityName.js
entityName/@desktop-ie8/entityName.css
entityName/@desktop/entityName.css
entityName/@touch/entityName.css
entityName/@touch/entityName.js |
|
Просто личные ощущения. |
|
С элементами и модификаторами норм? # Схема с суффиксами
entityName/entityName.css
entityName/entityName.js
entityName/[email protected]
entityName/[email protected]
entityName/[email protected]
entityName/[email protected]
entityName/_mod/entityName_mod_val.css
entityName/_mod/entityName_mod_val.js
entityName/_mod/[email protected]
entityName/_mod/[email protected]
entityName/__elem/entityName__elem.css
entityName/__elem/entityName__elem.js
entityName/__elem/[email protected]
entityName/__elem/[email protected]
entityName/__elem/[email protected]
entityName/__elem/[email protected]
entityName/__elem/_mod/[email protected]
entityName/__elem/_mod/[email protected]
# Схема с папками
entityName/entityName.css
entityName/entityName.js
entityName/@desktop-ie8/entityName.css
entityName/@desktop/entityName.css
entityName/@touch/entityName.css
entityName/@touch/entityName.js
entityName/_mod/entityName_mod_val.css
entityName/_mod/entityName_mod_val.js
entityName/_mod/@touch/entityName_mod_val.css
entityName/_mod/@touch/entityName_mod_val.js
entityName/__elem/entityName__elem.css
entityName/__elem/entityName__elem.js
entityName/__elem/@desktop-ie8/entityName__elem.css
entityName/__elem/@desktop/entityName__elem.css
entityName/__elem/@touch/entityName__elem.css
entityName/__elem/@touch/entityName__elem.js
entityName/__elem/_mod/@touch/entityName__elem_mod_val.css
entityName/__elem/_mod/@touch/entityName__elem_mod_val.js |
|
@zxqfox кажется 🔥 |
|
@zxqfox ты предлагаешь поддерживать обе схемы? |
|
Схема с суффиксами вообще монструозно выглядит же. в виде сырого вброса: где |
|
@gurugray это следующий шаг, я думаю |
|
@zxqfox я просто думал это issue про следующий шаг :) |
|
@gurugray Я думаю, что ты этот шаг расширил, и теперь это он и есть) |
|
Голосую за схему с папками по платформам. Если прятать платформу в папку с модификатором — наглядность очень сильно страдает имхо. |
|
@tadatuta В виме не работает, как починить? |
|
ping |
|
Вдруг кого-то интересует мнение дизайнера: Я голосую за вариант BlockName[.platform].tech — у @ilyar хорошие аргументы. Не забудьте убить кебаб-кейс, пожалуйста. И, мне кажется, что лучше не просто кемлкейс, но и с большой буквы — потому что уже есть bem-react-core да и читается лучше. Наверное, еще в нейминге придется предусмотреть тип технологии: ну и: Распихивание по папкам лично для меня неудобно тем, что в табах (моего, не у всех vim) редактора это знание теряется — а имя файла видно всегда и может содержать ту же информацию. Плюс в саблайме, скажем, быстрая навигация по cmd+P с папками, кажется, работать не будет. Плюс меньше нажатий на стрелочки — только вверх-вниз для навигации между файлами блока. Ну и в целом, по моим наблюдением, на ощущение сложности иерархии влияет ее глубина, а не количество детей в одной ветке. |
|
Для интереса попробовал объединить идеи этой ветки и #81. Такая версия без раскрытия Полное дерево блока product
├── @desktop.i18n
│ └── ru.js
├── @touch.i18n
│ └── ru.js
├── __attrs
│ ├── @desktop.styles.styl
│ └── @touch.deps.js
├── __badge
│ ├── @desktop.styles.styl
│ ├── bemhtml.js
│ └── bemtree.js
├── __cart
│ ├── bemtree.js
│ └── deps.js
├── __description
│ └── bemhtml.js
├── __image
│ ├── @desktop.styl
│ ├── @touch.styles.styl
│ ├── bemhtml.js
│ └── deps.js
├── __image-placeholder
│ ├── bemhtml.js
│ ├── deps.js
│ └── styles.styl
├── __label
│ ├── bemhtml.js
│ └── styles.styl
├── __link
│ ├── @desktop.bemhtml.js
│ ├── @desktop.deps.js
│ ├── @desktop.styles.styl
│ ├── @touch.bemhtml.js
│ ├── @touch.deps.js
│ └── @touch.styles.styl
├── __link-image
│ ├── @desktop.styles.styl
│ ├── @touch.bemtree.js
│ ├── bemhtml.js
│ ├── bemtree.js
│ ├── deps.js
│ └── styles.styl
├── __packing
│ ├── @desktop.bemtree.js
│ ├── @desktop.deps.js
│ ├── @touch.deps.js
│ └── @touchbemtree.js
├── __price-info
│ ├── bemtree.js
│ └── deps.js
├── __sku
│ └── @desktop.styles.styl
├── __stock
│ ├── @desktop.bemhtml.js
│ └── @desktop.styles.styl
├── __stock-status
│ ├── @desktop.styles.styl
│ ├── @touch.styles.styl
│ └── bemtree.js
├── __subinfo
│ ├── @desktop.bemtree.js
│ ├── @desktop.deps.js
│ ├── bemhtml.js
│ ├── deps.js
│ └── styles.styl
├── __subinfo-row
│ └── bemhtml.js
├── __title
│ ├── _view
│ │ └── _single
│ │ └── @touch.styles.styl
│ ├── @desktop.styles.styl
│ ├── @touch.styles.styl
│ └── bemhtml.js
├── __unit
│ ├── bemhtml.js
│ └── deps.js
├── __val
│ ├── bemhtml.js
│ └── styles.styl
├── __watch-now
│ ├── bemtree.js
│ └── deps.js
├── __weight
│ ├── @desktop.bemhtml.js
│ └── @desktop.styl
├── __wishlist
│ ├── bemhtml.js
│ ├── deps.js
│ └── styles.styl
├── _view
│ ├── _flat
│ │ ├── @desktop.bemtree.js
│ │ ├── @desktop.deps.js
│ │ └── @desktop.styles.styl
│ ├── _grid
│ │ ├── @desktop.bemtree.js
│ │ ├── @desktop.deps.js
│ │ └── @desktop.styles.styl
│ ├── _list
│ │ ├── @desktop.bemtree.js
│ │ ├── @desktop.deps.js
│ │ ├── @desktop.styl
│ │ ├── @touch.bemtree.js
│ │ ├── @touch.deps.js
│ │ └── @touch.styles.styl
│ ├── _preview
│ │ ├── @desktop.bemtree.js
│ │ ├── @desktop.deps.js
│ │ ├── @desktop.styles.styl
│ │ ├── @touch.bemtree.js
│ │ ├── @touch.deps.js
│ │ └── @touch.styles.styl
│ ├── _short
│ │ ├── @desktop.bemtree.js
│ │ ├── @desktop.deps.js
│ │ └── @desktop.styles.styl
│ ├── _short-flat
│ │ ├── @touch.bemtree.js
│ │ ├── @touch.deps.js
│ │ └── @touch.styles.styl
│ └── _single
│ ├── @desktop.bemtree.js
│ ├── @desktop.deps.js
│ ├── @desktop.styles.styl
│ ├── @touch.bemtree.js
│ ├── @touch.deps.js
│ ├── @touch.styles.styl
│ ├── bemtree.js
│ └── deps.js
├── i18n
│ └── ru.js
├── @desktop.browser.js
├── @desktop.deps.js
├── @desktop.styles.styl
├── @touch.deps.js
├── @touch.styles.styl
├── bemhtml.js
├── bemtree.js
├── browser.js
├── deps.js
└── styles.styl
35 directories, 107 filesИз плюсов - сразу видно все возможные модификаторы блока, он становится как на ладони. Из минусов пока не знаю... Т.к. в бою такую схему не пробовал ещё. |
|
Пример CtrlP в vim |
|
Получается такая схема |
@blond ;)
The text was updated successfully, but these errors were encountered: