leecade / koa-webpack-middleware

webpack dev&hot middleware for koa2
214 stars 29 forks source link

How to run middleware with other routes #23

Open cyberwombat opened 7 years ago

cyberwombat commented 7 years ago

So I tried to convert this app to Koa2. I ran into a couple of issues.

My setup was basically 3 middleware - dev, hot and my catch all route to send the isomorphic code.

The issues I experienced was that I would either get 404 or it would dump my final html to the desktop instead of displaying it. I ended up having to modify this middleware to only accept routes that match the path (just like they have in the express module).

Unfortunately I then ran into another issue of headers being sent - I tracked it down to the script tags in my catch all route html code that call the webpack bundle.

I eventually gave up and am using the webpack dev server CLI but I would love to see a working example of what I am talking about. I could not find any examples in the wild of a single hmr/isomorphic server - everyone seems to do two servers.

noinkling commented 7 years ago

Yeah I noticed the Content-Type header always gets set to application/octet-stream for any middleware after the hot middleware (regardless of path), which causes Chrome to prompt for download. I believe this is because a stream always gets assigned to ctx.body here, so Koa detects this and automatically sets the response type to application/octet-stream as per the documentation.

To work around it I used koa-mount with the path my webpack assets are being served from (i.e. publicPath) and made sure my webpack config had dynamicPublicPath=true for the hot middleware query string options.