webpack proxy for wordpress

webpack proxy for wordpress

		config.devServer = {
			proxy: {
        //here we declare to proxy all the requests not handled by webpack. I this case everything webpack bundle is in
        // dist/ and so we don't proxy it to let the webpack dev server handle it
				'!**/dist/**': {
          //set the URL of the wordpress site
					target: 'http://mysite.test',
					changeOrigin: true,
					onProxyRes: function(proxyRes, req, res) {
						if( proxyRes.headers &&
					        proxyRes.headers[ 'content-type' ] &&
					        proxyRes.headers[ 'content-type' ].match( 'text/html|application/json' ) ) {

							var _write = res.write, _writeHead = res.writeHead;

							res.writeHead = function(){
					            if( proxyRes.headers && proxyRes.headers[ 'content-length' ] ){
					                res.removeHeader('content-length');
					            }

					            // This disables chunked encoding
					            res.setHeader( 'transfer-encoding', '' );

					            // Disable cache for all http as well
					            //res.setHeader( 'cache-control', 'no-cache' );

					            _writeHead.apply( this, arguments );
					        };

							res.write = function (data) {
							    //set again the domain of the wordpress site to replace js, css, images paths to the webpack dev server
                  const newdata = data.toString().replace(/mysite\.test/g, req.headers.host);
							    _write.call(res, newdata);
							}
						}
					}
				}
			},
		};