[HTML-гайд] Перенос атрибутов

[x1unix]

Иногда возникает ситуация, когда у HTML-элемента появляется большое количество аттрибутов, или значение у аттрибутов очень длинное и приходится переносить аттрибуты.

Этот пункт упускают очень многие style-гайды (гугловый в том числе)

Предлагаю добавить пункт о переносе аттрибутов, например:

<div
  id="myComponentItem32"
  class="my-component__item my-component__item--dashed"
  data-ng-click="loadSomething();"
  data-ng-class="{'text-center': isCentered}"
  title="Lorem Ipsum Dolor...."
>
  Lorem Ipsum Dolor Sit....
</div>

Пример выше часто используется в React-комьюнити

[installero]

Гугл предлагает ещё такой перенос:

<md-progress-circular md-mode="indeterminate" class="md-accent"
    ng-show="ctrl.loading" md-diameter="35">
</md-progress-circular>

Отступ 4 пробела — сомнителен, но в целом, идея не тратить по целой строке на каждый атрибут выглядит здравой.

[x1unix]

@installero, можно ссылку на пункт?

[installero]

Так сослался же:

https://google.github.io/styleguide/htmlcssguide.html#HTML_Line-Wrapping

[x1unix]

@installero, спасибо, сразу не заметил :)

Там представленны все три стиля переноса, включая представленный мной выше. Однако они все три - разные и соотсветственно тут надо выбирать один из них чтобы поддерживать единый стиль кода.

[installero]

Почему? Во многих стайл-гайдах допускается использование одного из нескольких вариантов. Например, в стандартном гайде отступ 2 пробела при вложенности в контейнер — опционален.

It is not necessary to indent every element

[nikolai-shabalin]

Тут бы понять "много" это сколько? Поделитесь своими мыслями. Я остановился на цифре 5, но кажется, что и 4 много если атрибуты строковые. Например, src="...." или class="class1 class2 class3"