Razzle: Hacer que razzle se ejecute en el contenedor de desarrollo de Docker

Creado en 1 dic. 2017 · 3Comentarios · Fuente: jaredpalmer/razzle

Al buscar en los problemas de este repositorio, parece que algunos de los colaboradores están familiarizados con el uso de Docker, por lo que tal vez alguien podría brindarme un poco de ayuda. Estoy tratando de configurar un flujo de trabajo de desarrollo con la ventana acoplable y poder hacer que hmr reaccione dentro de un contenedor acoplable. El objetivo es obtener una solución que funcione sin necesidad de piratear demasiado el proyecto base razzle-create-app. He creado mi dockerfile de la siguiente manera:

FROM node:6

WORKDIR /home/node/app

EXPOSE 3000
EXPOSE 3001

CMD ["npm", "start"]

entonces estoy iniciando el contenedor con el directorio dev montado como un volumen con
docker run --name hmr-test -d -p 8080:3000 -p 3001:3001 -v C:\Users\charles\Desktop\docker-hmr-test\ui-service:/home/node/app docker-hmr

La aplicación se ejecuta y se muestra correctamente, pero razzle no detecta ningún cambio que se realice en el sistema de archivos local. Si ejecuto bash en el contenedor y cateo los archivos, puedo ver que se están actualizando correctamente y razzle se inicia desde el directorio correcto en el contenedor, entonces, ¿por qué razzle no reconoce los archivos y los reconstruye?

Fuente

alexjoyner

Comentario más útil

Este problema tiene que ver con un problema conocido que se ejecuta en Docker. Ejecutar un contenedor desde un entorno de Windows no comunica los eventos del archivo al contenedor docker con funcionalidad nativa. La solución alternativa actual hasta que se implemente la funcionalidad nativa es usar el sondeo de webpack en el contenedor de la ventana acoplable para permitir que webpack sondee los cambios en el sistema de archivos. Por lo tanto, debe agregar esto a un archivo razzle.config.js para que hmr vea las actualizaciones:

       if(config.devServer){
            config.devServer.watchOptions['poll'] = 1000;
            config.devServer.watchOptions['aggregateTimeout'] = 300;
        }

@jaredpalmer Si esto es algo para lo que le gustaría tener una rama de funciones, podría trabajar en algo para un PR. Sólo házmelo saber. Gracias por hacer este increíble kit de inicio.

alexjoyner en 3 dic. 2017

🎉3

Todos 3 comentarios

       if(config.devServer){
            config.devServer.watchOptions['poll'] = 1000;
            config.devServer.watchOptions['aggregateTimeout'] = 300;
        }

@jaredpalmer Si esto es algo para lo que le gustaría tener una rama de funciones, podría trabajar en algo para un PR. Sólo házmelo saber. Gracias por hacer este increíble kit de inicio.

alexjoyner en 3 dic. 2017

🎉3

@alexjoyner santo molibdeno. Gracias por resolver esto. No soy un tipo de javascript, así que esto me ayudó mucho.

AlexMorreale en 8 dic. 2017

👍2

la configuración no funcionó para mí. parece que se está actualizando pero no se ve en el navegador.

El siguiente registro muestra el inicio y el cambio al archivo.

0|razzle   |
0|razzle   | > [email protected] start /app/razzle/razzle
0|razzle   | > razzle start
0|razzle   |
0|razzle   |  WAIT  Compiling...
0|razzle   |
0|razzle   | ℹ Compiling Client
0|razzle   | ℹ ｢wds｣: Project is running at http://apps.syntapse.co.uk:3001/
0|razzle   | ℹ ｢wds｣: webpack output is served from undefined
0|razzle   | ℹ ｢wds｣: Content not from webpack is served from /app/razzle/razzle
0|razzle   | ℹ ｢wds｣: 404s will fallback to /index.html

0|razzle  | ✔ Client: Compiled successfully in 8.28s
0|razzle  | ℹ Compiling Server
0|razzle  | ✔ Server: Compiled successfully in 765.85ms
0|razzle  | Warning: Please use `require("react-router-dom").Route` instead of `require("react-router-dom/Rout0|razzle  | Warning: Please use `require("react-router-dom").Switch` instead of `require("react-router-dom/Swi0|razzle  | ✅  Server-side HMR Enabled!
0|razzle  | 🚀 started
0|razzle  | ℹ Compiling Server
0|razzle  | ✔ Server: Compiled successfully in 88.70ms
0|razzle  | 🔁  HMR Reloading `./server`...
0|razzle  | [HMR] Updated modules:
0|razzle  | [HMR]  - ./src/Home.js
0|razzle  | [HMR]  - ./src/App.js
0|razzle  | [HMR]  - ./src/server.js
0|razzle  | [HMR] Update applied.
0|razzle  | ℹ Compiling Client
0|razzle  | ✔ Client: Compiled successfully in 73.55ms
0|razzle  | ℹ Compiling Client
0|razzle  | ✔ Client: Compiled successfully in 228.31ms