Есть ли в HTML функция авто-отступа или плагин для Sublime Text (он же prettify / beautify / format)?


23

Например, что-то изменить:

<section><article><h1></h1><p></p></article></section>

чтобы:

<section>
  <article>
    <h1></h1>
    <p></p>
  </article>
</section>

... это работает на полных страницах и фрагментах.

  • Встроенная Edit > Line > Reindentнастройка не делает этого
  • Плагин HTMLTidy добавляет headи bodyтеги, поэтому он не работает для частичных, у него также есть различные другие проблемы
  • Плагин Tag имеет различные проблемы , достаточно того, что он по сути не работает
  • Плагин HTMLPrettify имеет различные проблемы , требует node.js и не обновлялся месяцами.
  • gist.github.com/mcdonc/3898894 утверждает, что делает это, но требует Emacs

(Notepad ++ имел авто-отступ, Dreamweaver имел Применить форматирование исходного кода, Aptana имеет формат и т. Д.)

Плагин Tag неправильно обрабатывает встроенные теги , например, используя его в следующем фрагменте:

<p>foo<a>bar<span>baz<span>qux</span></span></a></p>

результаты в:

<p>
    foo
    <a>
        bar
        <span>
            baz
            <span>qux</span>
        </span>
    </a>
</p>

В чем вопрос? Из вашего поста не понятно, в чем вопрос.
Брэд Паттон

Отредактированное название должно быть вопросительным. Я пытаюсь найти способ автоматического отступа HTML в Sublime Text.
user110241


Спасибо, я пробовал каждое решение в этой теме, ни одно из них не работает. Я перечислил причины, почему многие из них не работают в этой теме.
user110241

Я думаю, что это лучшее рабочее решение: jsbeautifier.org У меня было такое же требование отформатировать несколько встроенных тегов. Этот работает очень хорошо. Он также создает правильную разметку для возвышенного текста, который может закрывать фрагменты. Это также доступно на CLI как npmjs.com/package/js-beautify
Саи Кришна Глубокий

Ответы:


18

reindentНе всегда работает на фрагменты. Вы можете использовать Tagплагин (установить из пакета управления). Затем просто нажмите ctrl+ shift+ pи введите tag. Вы увидите вариант Auto-Format tags on document. Выберите и нажмите Enter. Это сделает это.


1
Как я упоминал в оригинальном посте, плагин Tag не работает, особенно в его обработке встроенных тегов, среди других очень плохих ошибок. Автор сказал, что ему нужно «переписать все это». Переопределение вообще не работает для HTML, оно не исправляет отступы; он просто выравнивает теги до определенного уровня отступа.
user110241

ну, Тэг работал на меня. Я использовал ваш HTML-фрагмент. Это сработало без нареканий. И Reindent работает для HTML, но при определенных условиях.
Бибхас

попробуйте использовать автоформат Tag на этом фрагменте: <p>foo<a>bar<span>baz<span>qux</span></span></a></p>чтобы понять, что я имею в виду. Это также портит форматирование открывающего тега HTML, обернутого в условные комментарии IE, который является частью HTML5 Boilerplate (и комментариев в целом). Попробуйте использовать встроенный в Line > Reindentэтот фрагмент: jsfiddle.net/y8xXj, чтобы увидеть, как он не работает.
user110241

К вашему сведению - только что попробовал в Sublime Text 3 с фрагментом HTML, и это действительно работает!
Стивен

2
Та же проблема. В прошлом я использовал бесчисленные редакторы: Coda, Sublime, Espresso, Chocolat, TextMate ... но никому не удавалось безошибочно отформатировать текст, как в Dreamweaver's Apply Source Formatting. На что люди просто предлагают Tidy или какой-то другой плагин, который никогда не работает как Dreamweaver. Я рад, что кто-то "Zooted" видит эту проблему. К сожалению, до сих пор нет решения. В Sublime Text 3, отмеченном как Zooted, даже с Tag он не работает должным образом (как в приведенном выше примере). А родная функция Reindent довольно бесполезна.
Cchiera

6

Выберите All -> Edit menu -> Line -> Reindend . Вы можете установить комбинацию клавиш для того же использования.

{"keys": ["ctrl + shift + r"], "command": "reindent", "args": {"single_line": false}}


1
Как я уже упоминал в вопросе, это не работает. Попробуйте это в самом первом предоставленном мною фрагменте: <section> <article> <h1> </ h1> <p> </ p> </ article> </ section>
user110241

Работает для меня. Синтаксис установлен в HTML?
Мануэль Арвед Шмидт

2
Не работает для меня
Дерек 朕 會 功夫

Да, он довольно неплохо работает, но в конце концов начал сбрасывать, в моем случае <div>открывая теги.
ruffin

0

Для того, чтобы функция Reindent работала, вы должны снять флажок «Indent Using Spaces»:

Вид >> Отступ >> Отступ с использованием пробелов

После того, как эта опция была снята, вы можете выбрать свой текст и переосмыслить:

Редактировать >> Строка >> Перерасчет

Это будет работать как для синтаксиса HTML, так и для XML. Не проверено ни на каких других.


Я уже работал с этим без контроля. Упомянутая вами команда абсолютно ничего не делает с этим фрагментом в ST3:<html><head></head><body><div><p>foobar<span>baz</span></p></div></body></html>
user110241
Используя наш сайт, вы подтверждаете, что прочитали и поняли нашу Политику в отношении файлов cookie и Политику конфиденциальности.
Licensed under cc by-sa 3.0 with attribution required.