Visual Studio Code - принудительное форматирование кода для переноса атрибута / свойства с максимальной длиной строки - PullRequest
0 голосов
/ 22 января 2019

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

Для разработки своего проекта я использую код Visual Studioс Angular и Typescript, а также некоторыми внешними библиотеками.В проекте так много длинных строк HTML (и не только), поэтому я бы хотел, чтобы код был хорошо отформатирован.Позвольте мне показать короткий пример:

перед форматированием:

<grid-column field="formatCode" title="Format" width="65" class="status-column cell-with-button" *ngIf="width > 1" [class]="{ codeColumn: true }" [hidden]="columns[7].hidden"></grid-column>

ожидаемый результат:

<grid-column field="incoTermCode" title="Incoterm" width="65"
    class="status-column cell-with-button" *ngIf="width > 1"
    [class]="{ codeColumn: true }" [hidden]="columns[7].hidden"
></grid-column>

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

До сих пор я использовал кодировщик Преттиера, но нет такой опции, как хотелось бы, и это специально (прокрутите вниз, чтобы найти ответы) .Вот как Преттир работает с приведенным выше примером кода:

Форматирование Преттира:

<grid-column
    field="formatCode"
    title="Format"
    width="65"
    class="status-column cell-with-button"
    *ngIf="width > 1"
    [class]="{ codeColumn: true }"
    [hidden]="columns[7].hidden"
></grid-column>

Это не то, что я хочу, но, допустим, все в порядке.Но посмотрите на другой пример:

ожидается:

<div class="valid" *ngIf="form.get('pieces').get([i]).get('quantity').valid>
 <img alt="Validity icon - valid" src="assets/common/images/icons/ValidIcon.svg">
</div>

perttier:

<div
  class="valid"
  *ngIf="
    form
      .get('pieces')
      .get([i])
      .get('quantity').valid
  "
>
  <img alt="Validity icon - valid" src="assets/common/images/icons/ValidIcon.svg" />
</div>

Представьте, что это всего лишь короткий пример, есть многоВ моем проекте на 3-4 раза длиннее строки, отформатированные так.Мне очень нравится Преттье, потому что он хорошо справляется со всеми этими задачами в отношении исправлений сохранения, однако я не хочу, чтобы в моих файлах было в 10 и более раз больше строк, чем необходимо.

Кто-нибудь может что-нибудь посоветовать?

Ответы [ 2 ]

0 голосов
/ 22 января 2019

Посмотрите, будет ли "html.format.wrapAttributes": "auto" переопределять это более красивое форматирование.

0 голосов
/ 22 января 2019

Отключите красивее и поиграйтесь с этими настройками, пока не получите желаемое форматирование

    "html.format.wrapLineLength": 100,
    "html.format.wrapAttributes": "aligned-multiple"
...