我的应用程序如何拆分成块
我的应用程序主要且唯一的入口块包含一些在整个应用程序中重用的通用逻辑，例如布局或辅助方法以及与身份验证相关的组件，例如登录/注册对话框。这个块在其依赖树的目录中具有react、react-dom、和其他一些库，redux因为它们正在被身份验证组件使用。react-routernode_modules
所有这些依赖项都捆绑到一个app.js始终初始加载的文件中。每当用户开始使用需要登录用户的应用程序的某些部分时——例如仪表板、表单和其他应用程序功能，就会加载包含该功能的附加 javascript 块。webpack由于import()分布在整个应用程序代码中的调用，这些额外的块是自动生成的。
当新用户加载应用程序但未登录时，app.js将加载该应用程序并为用户提供登录掩码。用户成功登录并重定向到主仪表板后，仪表板的代码将异步加载。该代码由 自动构建到dashboard.js块中webpack，还依赖于许多已经嵌入到app.js块中的库（例如react等react-dom）。因为该dashboard.js块不复制那些库，所以与app.js.
为了充分利用浏览器缓存，所有这些块（在这个简化的示例中：入口块app.js和动态块dashboard.js）
[chunkhash]的名称中都有一个。与来自 的库代码相比，node_modules动态块的代码和app.js实际应用程序代码的部分都发生了很大变化。
我想做什么
我想以webpack一种方式进行配置，以检测哪些库
node_modules在超过 2 个（或任何可配置数量）的块中使用，并自动将它们拆分为一个额外的块，vendor.js.
app.js该块应包含当前不经常更改的库部分，因此用户不会经常重新下载库代码。
据我了解，
CommonsChunkPlugin在手动添加大量条目块时可以完成类似的操作。我也可以通过import()调用执行的动态代码拆分来做到这一点吗？
例子
我可能会lodash.partialRight在dashboard.js. 只要它只在那里使用，我希望它与dashboard.js. 当我还在登录/注册过程中使用它时，它不应该像
app.js现在这样捆绑，而是应该自动捆绑到vendor.js跨块重用的其他库中。