Webpack可变地命名需要

Question

我正在编写一个nodejs / react应用程序，其功能模块最好通过configuration.json文件打开和关闭。功能模块有一个入口点，用于为其请求建立服务器端路由，另一个用于在React中建立客户端路由。

服务器端配置工作得很好。在服务器启动时，它检查配置设置，加载相应的模块，并调用其register（）函数，注册其服务器端路由，控制器等。但是，当尝试webpack这个包以进行部署时客户端，我在尝试迭代要包含的模块列表时遇到问题，并将它们webpacked到正在部署的包中。

到目前为止，我已经做了很多研究，但是webpack仍然有点难以理解。我最接近的是在我的webpack.config.js文件中添加一个部分，用于将路由预加载到各个模块，将它们包含在捆绑包中以使代码在客户端上可用，然后将它们的名称粘贴到FEATURE_MODULES全局变量通过DefinePlugin，并在React中检查它是否存在，尝试在这些模块到达浏览器后加载并注册（）。

到目前为止，代码似乎已添加到bundle中，并且模块路径在该全局变量中正确传递给客户端，但尝试在客户端上要求（）它们会引发关于模块的错误而不是被发现，很可能是因为webpack正在用其查找映射的数字替换模块名称。

我也遇到过关于require.context的问题，能够RegExp这些东西，但这就是我开始迷路的地方。任何人都可以向我提供一个示例或链接到更容易消费的东西，以演示如何完成这项工作吗？

Answer 1

不是100％明确你正在做的事情正在破裂（如果以上情况没有帮助，你可以发布具体内容吗？），但一般指导原则：

• Webpack将解析它在代码中看到的任何require（）;它是一个不太“智能”的静态解析器。所以传统的条件逻辑围绕着哪些事情需要解决你的问题，因为所有的需求都会得到解析
• 如果您的条件检查布尔变量（通常通过Define插件定义），webpack解析器将理解它们，并且只有通过条件检查的要求才会被解析。然后，您可以使用Uglify插件的死代码消除来摆脱不需要的条件逻辑。
• “动态”需求通常是一个坏主意，因为它们会导致webpack捆绑所请求目录中的每个文件（因为它无法确定您在构建时要求的那个文件）。如果您要求的东西不存在，那么您可能会遇到运行时错误（显然建立时错误）。

上面的内容应该可以满足您的需求。使用数字替换文件路径需要的是webpack的运行时是如何工作的，所以如果这是一个问题，你可能会采取错误的方式。

如果您似乎必须通过define插件定义太多标志，和/或设置太多条件逻辑 - 这些是单独的构建吗？使用单个webpack配置文件设置多个构建并在它们之间重用共享配置非常容易。