Как сконфигурировать docker для wordpress и gulp?
По вводным: нужен совет по докеру. У меня есть сборка на галпе. Я решил внедрить туда вордпресс. Докер настроил, всё работет.
Структура проекта
Сейчас по такому адресуLocalhost:8080По вводным: открывается вп версия сайта. При изменениях в php файлах внутри темы всё работает.
По вводным: при изменениях в sass файлах они помещаются сразу в тему (wp/wp-content/themes/main) и после обновления страницы тоже всё работает.
По вводным: планирую настроить livereload, чтобы при изменениях в sass, js, php файлах тутLocalhost:8080Нужно понять: страница обновлялась. Никак не получается настроить. Подскажите, какие настройки нужно указать в галпе для browsersync и какие в настройках докера. И реально ли вообще это сделать?
browsersync.init({ proxy: "http://localhost:8080", // это не помогает. Всё равно при запуске галпа сайт открывается тут http://localhost:3000/ notify: false, open: true, });Docker-compose.yml:
version: "3.8" services: wordpress: build: ./docker/php container_name: wp_local ports: - "8080:80" environment: WORDPRESS_DB_HOST: db WORDPRESS_DB_NAME: wp_db WORDPRESS_DB_USER: wp_user WORDPRESS_DB_PASSWORD: wp_pass volumes: - ./wp/wp-content:/var/www/html/wp-content depends_on: - db db: image: mysql:8.0 container_name: wp_db_local restart: always environment: MYSQL_DATABASE: wp_db MYSQL_USER: wp_user MYSQL_PASSWORD: wp_pass MYSQL_ROOT_PASSWORD: root_pass volumes: - db_data:/var/lib/mysql volumes: db_data:Опишите проблему, и специалист поможет с настройкой, исправлением ошибки или доработкой сайта. Подберём понятный план работ без лишней переписки.
Пока нет других ответов. Будьте первым, кто поможет автору.
Ответить на вопрос
Для WordPress + Gulp в Docker лучше разделить контейнеры по ролям: WordPress/PHP, база данных, возможно phpMyAdmin/Adminer, и отдельный Node-контейнер для Gulp. Не надо ставить Node и Gulp внутрь WordPress-контейнера, если это не требуется для production. Так проще обновлять зависимости и не смешивать PHP-окружение со сборкой фронтенда.
Пример структуры:
project/ docker-compose.yml wordpress/ theme/ package.json gulpfile.jsproject/ docker-compose.yml wordpress/ theme/ package.json gulpfile.js
Пример compose-логики:
services: db: image: mysql:8.0 environment: MYSQL_DATABASE: wordpress MYSQL_USER: wordpress MYSQL_PASSWORD: wordpress MYSQL_ROOT_PASSWORD: root wordpress: image: wordpress:php8.3-apache ports: - "8080:80" volumes: - ./wordpress:/var/www/html - ./theme:/var/www/html/wp-content/themes/my-theme environment: WORDPRESS_DB_HOST: db WORDPRESS_DB_USER: wordpress WORDPRESS_DB_PASSWORD: wordpress WORDPRESS_DB_NAME: wordpress gulp: image: node:20 working_dir: /app volumes: - ./theme:/app command: sh -c "npm install && npm run watch"
В теме настройте Gulp так, чтобы он писал CSS/JS в папку темы, подключаемую WordPress. Если нужен live reload, используйте BrowserSync и проксируйте WordPress URL, например
http://wordpressвнутри Docker-сети илиhttp://localhost:8080снаружи.Следите за правами файлов. На Windows и macOS bind mounts могут работать медленнее, а watch может не видеть изменения. Иногда помогает polling в Gulp/Chokidar.
Итог: WordPress и база — отдельные сервисы, Gulp — отдельный Node-сервис, тема примонтирована в WordPress. Это нормальная схема для локальной разработки: PHP живёт отдельно, сборка фронтенда отдельно, а результат попадает прямо в активную тему.