Webpack-encore: How to use webpack-encore in docker container?

Created on 9 Aug 2018  路  4Comments  路  Source: symfony/webpack-encore

Most helpful comment

Put a docker-compose.yaml file in the root of your project containing:

version: "3"

services:
    app:
        image: php:7.2-alpine
        volumes:
            - .:/app
        ports:
            - "${APP_PORT:-8000}:8000"
        working_dir: /app
        command: ["bin/console", "server:run", "0.0.0.0"]

    encore:
        image: node:10-alpine
        volumes:
            - .:/app
        ports:
            - "${DEV_SERVER_PORT:-8080}:8080"
        working_dir: /app
        command: ["yarn", "dev-server", "--host=0.0.0.0"]

To start your Symfony app + Encore dev server:

docker-compose up

To stop your Symfony app + Encore dev server:

docker-compose down

To build your assets for production:

docker-compose run --rm encore yarn build

All 4 comments

Hi @powerlimit,

Could you detail a bit more what you are trying to achieve and the issue(s) you are having?

As far as I know any container with Node.js + Yarn/npm should work fine with Encore.

``FROM php:7.2-fpm-alpine

ENV VERSION=v4.9.1 NPM_VERSION=2

ENV VERSION=v6.14.3 NPM_VERSION=3

ENV VERSION=v8.11.3 NPM_VERSION=5 YARN_VERSION=latest

ENV VERSION=v10.7.0 NPM_VERSION=6 YARN_VERSION=latest

WORKDIR /var/www/stf

For base builds

ENV CONFIG_FLAGS="--fully-static --without-npm" DEL_PKGS="libstdc++" RM_DIRS=/usr/include

RUN apk add --no-cache curl make gcc g++ python linux-headers binutils-gold gnupg libstdc++ && \
for server in ipv4.pool.sks-keyservers.net keyserver.pgp.com ha.pool.sks-keyservers.net; do \
gpg --keyserver $server --recv-keys \
94AE36675C464D64BAFA68DD7434390BDBE9B9C5 \
B9AE9905FFD7803F25714661B63B535A4C206CA9 \
77984A986EBC2AA786BC0F66B01FBB92821C587A \
71DCFD284A79C3B38668286BC97EC7A07EDE3FC1 \
FD3A5288F042B6850C66B31F09FE44734EB7990E \
8FCCA13FEF1D0C2E91008E09770F7A9A5AE15600 \
C4F0DFFF4E8C1A8236409D08E73BC641CC11F4C8 \
DD8F2338BAE7501E3DD5AC78C273792F7D83545D && break; \
done && \
curl -sfSLO https://nodejs.org/dist/${VERSION}/node-${VERSION}.tar.xz && \
curl -sfSL https://nodejs.org/dist/${VERSION}/SHASUMS256.txt.asc | gpg --batch --decrypt | \
grep " node-${VERSION}.tar.xz\$" | sha256sum -c | grep ': OK$' && \
tar -xf node-${VERSION}.tar.xz && \
cd node-${VERSION} && \
./configure --prefix=/usr ${CONFIG_FLAGS} && \
make -j$(getconf _NPROCESSORS_ONLN) && \
make install && \
cd / && \
if [ -z "$CONFIG_FLAGS" ]; then \
if [ -n "$NPM_VERSION" ]; then \
npm install -g npm@${NPM_VERSION}; \
fi; \
find /usr/lib/node_modules/npm -name test -o -name .bin -type d | xargs rm -rf; \
if [ -n "$YARN_VERSION" ]; then \
for server in ipv4.pool.sks-keyservers.net keyserver.pgp.com ha.pool.sks-keyservers.net; do \
gpg --keyserver $server --recv-keys \
6A010C5166006599AA17F08146C2130DFD2497F5 && break; \
done && \
curl -sfSL -O https://yarnpkg.com/${YARN_VERSION}.tar.gz -O https://yarnpkg.com/${YARN_VERSION}.tar.gz.asc && \
gpg --batch --verify ${YARN_VERSION}.tar.gz.asc ${YARN_VERSION}.tar.gz && \
mkdir /usr/local/share/yarn && \
tar -xf ${YARN_VERSION}.tar.gz -C /usr/local/share/yarn --strip 1 && \
ln -s /usr/local/share/yarn/bin/yarn /usr/local/bin/ && \
ln -s /usr/local/share/yarn/bin/yarnpkg /usr/local/bin/ && \
rm ${YARN_VERSION}.tar.gz; \
fi; \
fi && \
apk del curl make gcc g++ python linux-headers binutils-gold gnupg ${DEL_PKGS} && \
rm -rf ${RM_DIRS} /node-${VERSION}
/usr/share/man /tmp/* /var/cache/apk/* \
/root/.npm /root/.node-gyp /root/.gnupg /usr/lib/node_modules/npm/man \
/usr/lib/node_modules/npm/doc /usr/lib/node_modules/npm/html /usr/lib/node_modules/npm/scripts

COPY docker-entrypoint.sh /usr/local/bin
RUN chmod +x /usr/local/bin/docker-entrypoint.sh
ENTRYPOINT `["/usr/local/bin/docker-entrypoint.sh"]``

here is my dockerfile

``#!/bin/bash
if [ ! -f /public/build/manifest.json ]; then
yarn install
fi

exec "yarn run encore dev --watch"``

and here is entrypoint.

it does not work.

after creating container i want encore to watch changes in scss and js files. can you help?

Put a docker-compose.yaml file in the root of your project containing:

version: "3"

services:
    app:
        image: php:7.2-alpine
        volumes:
            - .:/app
        ports:
            - "${APP_PORT:-8000}:8000"
        working_dir: /app
        command: ["bin/console", "server:run", "0.0.0.0"]

    encore:
        image: node:10-alpine
        volumes:
            - .:/app
        ports:
            - "${DEV_SERVER_PORT:-8080}:8080"
        working_dir: /app
        command: ["yarn", "dev-server", "--host=0.0.0.0"]

To start your Symfony app + Encore dev server:

docker-compose up

To stop your Symfony app + Encore dev server:

docker-compose down

To build your assets for production:

docker-compose run --rm encore yarn build

maybe this is the problem:
https://symfony.com/doc/current/frontend/encore/virtual-machine.html#file-watching-issues

btw:

#!/bin/bash
if [ ! -f /public/build/manifest.json ]; then
yarn install
fi

this runs yarn install even when everything is installed but not yet build with webpack. But when yarn has installed, it returns rather quickly. So just skip the if

Was this page helpful?
0 / 5 - 0 ratings

Related issues

weaverryan picture weaverryan  路  4Comments

JohnnyEvo picture JohnnyEvo  路  3Comments

BackEndTea picture BackEndTea  路  3Comments

zek0faws picture zek0faws  路  4Comments

fanchyfanch picture fanchyfanch  路  3Comments