Using webpack infront of rails in development

Development
3

This works well in katello for me as well, my foreman diff looks like:

diff --git a/config/webpack.config.js b/config/webpack.config.js
index 596ad04..c34013b 100644
--- a/config/webpack.config.js
+++ b/config/webpack.config.js
@@ -15,7 +15,7 @@ var vendorEntry = require('./webpack.vendor');
 
 module.exports = env => {
   // must match config.webpack.dev_server.port
-  var devServerPort = 3808;
+  var devServerPort = 3000;
 
   // set TARGETNODE_ENV=production on the environment to add asset fingerprints
   var production =
@@ -179,7 +179,11 @@ module.exports = env => {
     config.devServer = {
       host: process.env.BIND || 'localhost',
       port: devServerPort,
+      disableHostCheck: true,
       headers: { 'Access-Control-Allow-Origin': '*' },
+      proxy: {
+        "/": "http://localhost:5001"
+      },
       hot: true
     };
     // Source maps

and in config/settings.yaml I added

:webpack_dev_server_https: false
:webpack_dev_server: false

then I ran the dev server with BIND=0.0.0.0 ./script/foreman-start-dev -p 5001

I’m a bit concerned at the amount of work and tribal knowledge needed to get a katello dev server w/ webpack and debugging capabilities running.

This isn’t very intuitive and beginner-friendly, which isn’t great considering we have interns starting soon. Can we make this process more configurable and have a “happy path” that just works when you spin up a new katello development environment? At the very least we should have clear documentation detailing the various dev server options available.

2 Likes