Какой алгоритм использовать при работе Gulp + WordPress?

Question

[Nik_1011]

Здравствуйте!

Что мне известно о созданий сайтов, Gulp и WP: можно писать сайты, добавляя библиотеки в index.html, использовать prepros для обновления страницы и компиляции в sass, а можно взять gulp, который выполняет вышеперечисленные функции(и не только) в одном месте.

Хорошо, здесь понятно, поставил библиотеки через npm i, страница обновляется,изображения минифицируются, ок. Дальше надо посадить верстку на WP. Вот здесь-то и начинаются вопросы.

1) Что лучше: ставить Gulp на OpenServer/MAMP и там уже верстать или сначала сверстать в Gulp, а затем файлы перевести в .php формат и посадить на WP?

2) Где можно взять хорошую актуальную сборку Gulp для WP и посмотреть как ей пользоваться(инструкция)?

Answer 1

[approximate solution]

Что лучше: ставить Gulp на OpenServer/MAMP и там уже верстать или сначала сверстать в Gulp, а затем файлы перевести в .php формат и посадить на WP?

На самом деле без разницы, отличие будет в том, что вам нужно будет просто отслеживать в watcher не только css\js, но и плюсом добавить туда php(ну и выставить в proxy ваш локальный сервер:

gulp.task('browserSync', function () {
  browserSync.init({
      proxy: "wordpress-project",
      notify: false,
  });
});

Если не набили руку с галпом, советую сперва сверстать, а потом уже накидывать верстку на wordpress. Будет проще.
Актуальная сборка:
https://wordpressify.ru/2018/09/wordpress-sobiraem...
https://css-tricks.com/gulp-for-wordpress-initial-...

Comments

[Nik_1011]

Спасибо Вам за оперативный ответ.
Если это возможно, ответьте на несколько моих вопросов,пожалуйста:

1)Если я сначала сверстаю на Gulp, чтобы после посадить на WP, то в конце верстки у меня получается один минифицированный файл header.min.css(в него комплируются libs.sass, main.sass,vars.sass) и этот файл, как и index.html, мне нужно будет заменить на формат php,верно?

2)Если после посадки минифицированного header.min.css в WP, его придется редактировать, а отображение кода там идет в одну строку, то как быть в данном случае? Как его открыть чтобы он был в нормальном виде?

3)Приемлем ли для веб-студий алгоритм сначала верстка на Gulp, затем посадка на WP?

[approximate solution]

1. Css так и остается вашим css файлом подключаемым к проекту в function.php с помощью хука. А вот ваш index.html вы должны разбить на шаблоны header.php, footer.php, front-page.php - это если вы верстаете главную страницу, с остальными все почти так же, только именуете уже согласно шаблонам страниц.
2. Минификация файлов идет перед самой выгрузкой шаблона на продакш, когда вы уже полностью сделали тему на WP(а не когда сверстали), поэтому пока вы не закончили вашу посадку, жать css и js не обязательно.
3. Студия\студии рознь - у каждой свой стиль работы, свои наработки. К тому же в студии не всегда следуют регламенту разработки.