This is an automated email from the ASF dual-hosted git repository.

maximebeauchemin pushed a commit to branch dev-server
in repository https://gitbox.apache.org/repos/asf/superset.git

commit b4761c3250fad818822b1134a6139771384a6d38
Author: Maxime Beauchemin <[email protected]>
AuthorDate: Wed Jan 15 14:48:41 2025 -0800

    feat: use npm run dev-server in docker-compose
    
    This configures docker to serve the interactive/dynamic webpack server at 
`localhost:9000`, and configures it to connect to the backend serve in another 
container at port 8088. It offers the convenience to auto-webpack and 
auto-refresh the pages as code is altered/saved.
---
 docker-compose.yml                        | 4 ++++
 docker/docker-frontend.sh                 | 4 +++-
 superset-frontend/webpack.config.js       | 4 +++-
 superset-frontend/webpack.proxy-config.js | 6 +++---
 4 files changed, 13 insertions(+), 5 deletions(-)

diff --git a/docker-compose.yml b/docker-compose.yml
index 471ac9363d..35891b2728 100644
--- a/docker-compose.yml
+++ b/docker-compose.yml
@@ -173,6 +173,10 @@ services:
       BUILD_SUPERSET_FRONTEND_IN_DOCKER: true
       NPM_RUN_PRUNE: false
       SCARF_ANALYTICS: "${SCARF_ANALYTICS:-}"
+      # configuring the dev-server to use the host.docker.internal to connect 
to the backend
+      superset: "http://host.docker.internal:8088";
+    ports:
+      - "127.0.0.1:9000:9000"  # exposing the dynamic webpack dev server
     container_name: superset_node
     command: ["/app/docker/docker-frontend.sh"]
     env_file:
diff --git a/docker/docker-frontend.sh b/docker/docker-frontend.sh
index f851576730..d086908de6 100755
--- a/docker/docker-frontend.sh
+++ b/docker/docker-frontend.sh
@@ -36,7 +36,9 @@ if [ "$BUILD_SUPERSET_FRONTEND_IN_DOCKER" = "true" ]; then
     npm install
 
     echo "Start webpack dev server"
-    npm run dev
+    # start the webpack dev server, serving dynamically at 
http://localhost:9000
+    # it proxies to the backend served at http://localhost:8088
+    npm run dev-server
 
 else
     echo "Skipping frontend build steps - YOU NEED TO RUN IT MANUALLY ON THE 
HOST!"
diff --git a/superset-frontend/webpack.config.js 
b/superset-frontend/webpack.config.js
index 1434d88187..1d0d35cfa6 100644
--- a/superset-frontend/webpack.config.js
+++ b/superset-frontend/webpack.config.js
@@ -525,12 +525,14 @@ let proxyConfig = getProxyConfig();
 
 if (isDevMode) {
   config.devServer = {
-    onBeforeSetupMiddleware(devServer) {
+    setupMiddlewares: (middlewares, devServer) => {
       // load proxy config when manifest updates
       const { afterEmit } = getCompilerHooks(devServer.compiler);
       afterEmit.tap('ManifestPlugin', manifest => {
         proxyConfig = getProxyConfig(manifest);
       });
+
+      return middlewares; // Make sure to return the middlewares
     },
     historyApiFallback: true,
     hot: true,
diff --git a/superset-frontend/webpack.proxy-config.js 
b/superset-frontend/webpack.proxy-config.js
index c2070bb92b..41835d88fa 100644
--- a/superset-frontend/webpack.proxy-config.js
+++ b/superset-frontend/webpack.proxy-config.js
@@ -24,12 +24,12 @@ const yargs = require('yargs');
 const parsedArgs = yargs.argv;
 
 const parsedEnvArg = () => {
+  let envArgs = {};
   if (parsedArgs.env) {
-    return yargs(parsedArgs.env).argv;
+    envArgs = yargs(parsedArgs.env).argv;
   }
-  return {};
+  return { ...process.env, ...envArgs };
 };
-
 const { supersetPort = 8088, superset: supersetUrl = null } = parsedEnvArg();
 const backend = (supersetUrl || `http://localhost:${supersetPort}`).replace(
   '//+$/',

Reply via email to