Add query parameter support about loadable-components HOT 3 OPEN

Your solution for server-side definitely works, but I am not sure if it can be adapted for client side.

The problem is - loadable is not importing scripts by itself, it's just asking webpack to do so with all script names being hardcoded in the webpack manifest.

So you have the following options:

• (hard) modify your script by injecting the language to alter manifest file and point to other files
• (easy) change URL format to /en-US/some/component/chunks.js, in this case you can use webpack.publicPath to control "prefix" setting it to where it should
  • done, that works like magic and more importantly scripts dont use any query string and are better cacheable

from loadable-components.

Solution I currently use is adding a routing method, which is by cookie, in nginx proxy server.

Then add response.cookie('lang', language) in request handler (which is server_side_renderer function in my project), so when the first request is responsed, there will be a lang field in the continuing request in HTTP Cookie header.

(⬆️ The hard way)

The easy way, is not that easy actually, because sometimes there may be dynamic language support demand, this is why I said:

NOTE: dynamic loaded component should stick to this rule as well.

As there is dynamic demands, webpack.publicPath is not a perfect solution as well, this can only solve static situations. There will be multi entry scripts which is compiled with different webpack.publicPath, the only difference among these scripts is the webpack.publicPath.

Maybe loadable's webpack plugin can add some hooks to solve this ? I'm not familiar with webpack development (actually I'm not a frontend engineer...).

from loadable-components.

Then add response.cookie('lang', language) in request handler

That actually should work out of the box. Just use cookies not extra query parameters

As there is dynamic demands, webpack.publicPath is not a perfect solution as well,

It is, because it can be configured in runtime. And that would be same script, just prefixed with language - something nginx can use instead of query attribute.

Maybe loadable's webpack plugin can add some hooks to solve this

It cannot because it's not only about loadable-stats (server side), but client-side as well, fully managed by webpack

from loadable-components.