dynamically set webpack publicPath when relative_url_root enabled

app/assets/javascripts/main.js

@@ -164,6 +164,14 @@ import './visibility_select';
 import './wikis';
 import './zen_mode';
 
+// set url root for webpack async chunks (assumes config.output.publicPath is an absolute path)
+if (gon && gon.relative_url_root) {
+  const basePath = gon.relative_url_root.replace(/\/$/, '');
+
+  // eslint-disable-next-line camelcase, no-undef
+  __webpack_public_path__ = basePath + __webpack_public_path__;
+}
+
 // eslint-disable-next-line global-require, import/no-commonjs
 if (process.env.NODE_ENV !== 'production') require('./test_utils/');
 

config/webpack.config.js

@@ -244,7 +244,6 @@ if (IS_DEV_SERVER) {
     hot: DEV_SERVER_LIVERELOAD,
     inline: DEV_SERVER_LIVERELOAD
   };
-  config.output.publicPath = '//' + DEV_SERVER_HOST + ':' + DEV_SERVER_PORT + config.output.publicPath;
   config.plugins.push(
     // watch node_modules for changes if we encounter a missing module compile error
     new WatchMissingNodeModulesPlugin(path.join(ROOT_PATH, 'node_modules'))