Tengo una aplicación de creación de reacciones y tengo dos requisitos que estoy tratando de lograr:

1 Gestión de idiomas para index.html:

• Cuando un usuario visita my-app/any/subpath?lng=en o my-app/any/subpath , se le debe mostrar index_en.html que enlaza con bundle.js
• Cuando un usuario visita my-app/any/subpath?lng=de , se le debe index_de.html con un enlace al mismo paquete bundle.js
• Este requisito es bastante fácil. Puedo resolverlo sirviendo mi interfaz con algo como NGINX y seleccionando el documento html por la cadena de consulta lng . Sin embargo, la parte difícil es obtener esta funcionalidad en mi entorno de desarrollo React local, que es mi segundo requisito a continuación:

2 Quiero lograr esto en mi entorno de desarrollo local, preferiblemente manteniendo Webpack Dev Server , para no perder los beneficios de la recarga en caliente y la reconstrucción automática en los cambios de código de reacción.

Lo que he hecho hasta ahora:

Parece que la aplicación Create React no es compatible con esto de forma predeterminada, por lo que he expulsado a través npm run eject . Construyo index_en.html e index_de.html a partir de un documento html base como parte de npm run start/build . Para crear varios documentos html, tuve que modificar webpack.config.js de la siguiente manera:

 const languages = ["en", "de"] ... module.exports = function(webpackEnv){ ... return { plugins: [ ...otherPlugins, ...languages.map(lng=> new HtmlWebpackPlugin({ inject: true, template: path.resolve(appDirectory, `public/index_${lng}.html`), filename: `index_${lng}.html`, ...(isEnvProduction ? productionConfig : {}), })) ] } }

Esto produce index_en.html e index_de.html de la manera que quiero, ambos vinculados a bundle.js .

Ahora, el problema es que si ejecuto npm run start , ambos se sirven en la misma ruta, por lo que Webpack Dev Server no sabe cuál servir. Quiero seleccionar entre ellos según un parámetro de consulta ?lng=de . ¿Es esto posible con el servidor de desarrollo webpack? ¿Y cuáles son mis opciones?

También he intentado poner los index.html localizados en carpetas separadas por idioma. Por ejemplo public/de/index.html , pero si accedo a myapp/de/some/subpath , aún recibiré la raíz index.html (inglés).