Как вы упрощаете работу с HTML препроцессорами?

Question

[beduin01]

Хочу начать использовать HTML препроцессоры в частности pug (бывший jade). Проблема в том, что писать HTML сразу в коде препроцессора несколько неудобно и нельзя без его компиляции в нормальный HTML взять и просмотреть в браузере.

Как вы обычно поступаете? Сразу все в коде препроцессора пишете или в начале в HTML, а потом если устроит результат в код препроцессора переводите?

Или может есть иные варианты?

Или сразу пишете:

doctype html
html
	head
		title includeExample
	body
		h2  the following content is not in this file ...
		include otherfile

Вопрос, а допустим миксины вы как как подключаете? Или все в одном файле описываете?

Answer 1

[Mr Crabbz]

в начале в HTML, потом если устроит результат в код препроцессора переводите?

мм.....что?! Вы понимаете, что препроцессоры придумали как раз для того, чтобы делать наоборот?

Comments

[Алексей Ярков]

как представлю... бррррр...

[beduin01]

поясните, не понял, вы так и пишите как в примере выше?

[Сергей]

beduin01: Конечно так и пишут) Ведь это для этого и сделано

[Ankhena]

beduin01: Цель ведь упростить себе жизнь.
Если Вы уже написали весь html, то зачем его потом переписывать в pug, чтобы он потом заново пересобрался в тот же html? жжжуть

Answer 2

[Hyubert]

одно слово решит вашу проблему - gulp

Comments

[Алексей Ярков]

я бы уточнил - gulp (watch) + browser-sync

[Hyubert]

Алексей Ярков: зачем? итак все понятно - нада гуглить gulp, а там уже пойдет и npm + gulp (watch) + browser-sync и так далее

Answer 3

[zooks]

Сразу пишется код на Jade (Pug), ведь это в разы удобнее.
Вот конвертер, поможет на первое время:
html2jade.org

Answer 4

[Viktor]

Если не хочешь заморачиваться с настройками галпа, поставь Prepros. Для базовых вещей его хватит.
Компиляция препроцессоров, минификация, liveReload