Создал дефолтное приложение Vue при помощи команды vue create vue-project. Установил Volar для форматирования vue компонентов. Столкнулся с проблемой, что форматировщик не переносит атрибуты в несколько строк (если один атрибут то в одной строке, если 2 или больше то каждый с новой). Посмотрел настройки Volar такой опции не нашёл. Тут даже не совсем понимаю на каком уровне это нужно менять, так чтобы это всегда работало. Настройки vs code, volar, es lint или prettier?
1 ответ
"html.format.wrapAttributes"
Это настройки HTML, а не Vue html.format.wrapAttributes
Не установлено
<div one="one" two="two" three="three">
...
</div>
"html.format.wrapAttributes": "force"
<div one="one"
two="two"
three="three">
...
</div>
"html.format.wrapAttributes": "force-aligned"
<div one="one"
two="two"
three="three">
...
</div>
"html.format.wrapAttributes": "force-expand-multiline"
<div
one="one"
two="two"
three="three"
>
...
</div>
-
Открыл настройки settings.json добавил эту строку "html.format.wrapAttributes": "force". Возвращаюсь в компонент -> нажимаю ctrl + s -> форматирования не происходит. Нажимаю прав клав. мыши -> форматировать документ -> тоже самое, всё на месте. Нажимаю прав клав. мыши -> форматировать документ с помощью -> в списке стоит только Volar– ЯрославCommented 7 апр. 2023 в 9:54
-
Правда на html файле то точно должно работать. Сохраняю html - всё равно не происходит форматирование– ЯрославCommented 7 апр. 2023 в 10:00
-
Итак. Задача была решена след образом: Почему-то у меня форматировщиком по умолчанию для HTML подставился некий esbenp.prettier-vscode при нажатии на форматирование ctrl+alt+f появилось окошко "Расширение esbenp.prettier-vscode настроено в качестве форматировщика, но недоступно" - дальше предложило настроить -> выбрал по умолчанию и всё заработало.– ЯрославCommented 7 апр. 2023 в 10:16
-
@Ярослав Никогда не понять мне: как этим ~га(м)ном~ "Prettier", люди пользуются. Пытался пару раз его ставить и все время получалось "Ugly". Commented 7 апр. 2023 в 13:49