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( '//+$/',
