Какие есть инструменты сборки html для верстальщика?

Question

[cnegaa]

Что лучше использовать для сборки html верстальщику, например я хочу вынести хедер в отдельный файл, а на страницах указывать какой-то тег в который потом будет подставляться html код хедера. Есть ли такие инструменты с графическим интерфейсом?

Comments

[Максим]

php такое умеет - написал шапку в отдельном файле и подключил в index.php => include_once 'header.php';

pug тоже самое написал шапку и обозвал её header.pug и так же подключил её => include files/header.pug

на javascript : https://www.w3schools.com/howto/howto_html_include.asp

[ProjectSoft]

cnegaa Для верстальщика - grunt, gulp, webpack и т. д.
У вас ни только html так должен собираться, но и css, js, оптимизация изображений, икончатые шрифты из глифов svg и т. д.

[Ankhena]

Именно верстальщику Gulp'а за глаза.
Вы можете использовать какой-нибудь плагин для работы с include. Например, Как использовать условие в gulp-file-include?
Либо прикрутить шаблонизатор (Twig, Nunjucks)

Есть ли такие инструменты с графическим интерфейсом?

Лишнее это. Один раз написали задачи и больше не смотрите туда.

[Антон Литвиненко]

gulp-rigger

[TheAthlete]

Можете использовать Webpack 5 и HTML Webpack Plugin

Пример шаблона

[cnegaa]

ProjectSoft, спасибо большое))

Answer 1

[Алексей Дубровин]

gulp плагин для конкретно этого действия.
gulp-inject-in-html

pug - препроцессор. Много всего в том числе и это

Comments

[Pavel_20]

это наподобие gulp file include я так понял?

[Алексей Дубровин]

Pavel_20, Если очень грубо, то да.

Answer 2

[Roman Serdyuk]

Лично я использую gulp-file-include - он позволяет внешне задавать переменные (даже отдельным файлом json) инклюдить любой файл (например svg) в любой файл.

Answer 3

[Sergei Nazarenko]

Есть ли такие инструменты с графическим интерфейсом?

Есть:

1. для macOS CodeKit
   
2. Для Windows, macOS и Linux Prepros
3. Для Windows, macOS и Linux Koala
   
4. Для Windows, macOS и Linux Fire.app