swashata / wp-webpack-script

💥🔥📦👩‍💻 An easy to use, pre configured, hackable webpack setup & development server for WordPress themes and plugins.
https://wpack.io
MIT License
407 stars 57 forks source link

How to make server works on docker #1258

Open bnbc opened 1 year ago

bnbc commented 1 year ago

Hello guys,

I have a php docker image and i want to know how can i access to the wpackio server when i launch npm start on the "site" container.

I dont have access to the http://172.18.0.4:3000 (wpackio server) out of my container, and it's normal, but i dont know how to do...

So maybe someone use wpackio in docker with success ?

Thks !

wpackio.server.js :

module.exports = {
    // Your LAN IP or host where you would want the live server
    // Override this if you know your correct external IP (LAN)
    // Otherwise, the system will always use localhost and will not
    // work for external IP.
    // This will also create some issues with file watching because for
    // some reason, service-worker doesn't work on localhost?
    // https://github.com/BrowserSync/browser-sync/issues/1295
    // So it is recommended to change this to your LAN IP.
    // If you intend to access it from your LAN (probably do?)
    // If you keep null, then wpackio-scripts will try to determine your LAN IP
    // on it's own, which might not always be satisfying. But it is in most cases.
    host: undefined,
    // Your WordPress development server address
    // This is super important
    proxy: 'http://localhost:8070/',
    // PORT on your localhost where you would want live server to hook
    port: 3000,
    // UI passed directly to browsersync
    ui: {
        port: 3001,
    },
    // Whether to show the "BrowserSync Connected"
    notify: false,
    // Open the local URL, set to false to disable
    open: false,
    // BrowserSync ghostMode, set to false to completely disable
    ghostMode: {
        clicks: true,
        scroll: true,
        forms: true,
    },
    // Override system calculated public path of the `dist` directory
    // This must have forward slash, otherwise it will not work.
    distPublicPath: undefined,
};

docker-compose.yml :

version: "3.8"
services:
    db:
        container_name: ${PROJECT_NAME}-mariadb
        image: mariadb
        environment:
            - MARIADB_ROOT_PASSWORD=${DB_PASSWORD}
            - MARIADB_DATABASE=${DB_NAME}
            - MARIADB_USER=${DB_USER}
            - MARIADB_PASSWORD=test
        networks:
            - universe
        volumes:
            - ./database:/var/lib/mysql
        restart: always  
    adminer:
        container_name: ${PROJECT_NAME}-adminer
        image: adminer
        restart: always
        depends_on:
            - db
        networks:
            - universe
        ports:
            - 8071:8080
    site:
        build: docker
        container_name: ${PROJECT_NAME}-site
        volumes:
          - ./wordpress:/var/www
        ports: 
            - 8070:80
        depends_on:
            - db
        networks:
            - universe
networks:
    universe:
        name: ${PROJECT_NAME}-universe-network

Docker :

FROM php:8.1-apache

# Extensions PHP
ADD https://github.com/mlocati/docker-php-extension-installer/releases/latest/download/install-php-extensions /usr/local/bin/
RUN chmod +x /usr/local/bin/install-php-extensions && install-php-extensions mysqli intl gd zip

# WP CLI
RUN curl -O https://raw.githubusercontent.com/wp-cli/builds/gh-pages/phar/wp-cli.phar
RUN chmod +x wp-cli.phar
RUN mv wp-cli.phar /usr/local/bin/wp

# Node
RUN apt update && apt install -yqq nodejs npm vim

# Apache conf
COPY ./apache.conf /etc/apache2/sites-available/000-default.conf

# Mémoire PHP pour faire fonctionner le projet
RUN echo 'memory_limit = 512M' >> /usr/local/etc/php/conf.d/docker-php-memlimit.ini

WORKDIR /var/www/