Webpack，vue.js和组件捆绑分离
我们正在尝试构build一个在客户端使用vue.js的“可插件”Java Web应用程序。
一般描述
假设我们想要得到下面的服务器端应用程序简化架构，没有在生产中使用NodeJs（使用Java和Osgi，但在我看来这并不重要，它可能是PHP，.Net或者其他）：
- 一个主要的Web应用程序，其中包括：vuejs2，路由器和一些通用的依赖项（bootstrap，jQuery等），在客户端，
- 许多Web应用程序插件，其中包括：附加和/或可选的vue.js组件和第三方依赖项。
我们想要什么
webapp执行检查服务器端可用的webapp插件的工作，然后在索引文件中公开适当的JS文件。 例如 ：
- app.js：主要的webapp加载器和一般的依赖关系，
- pluginA.js：由服务器端插件“A”提供的vue.js组件，
- pluginB.js：由服务器端插件“B”提供的vue.js组件。
整个webapp不是通过nodejs构build的，而是使用node和webpack分别构build3个示例。
约束
我们如何才能实现这些插件的构build过程：
- 我们希望避免javascript构build过程必须同时调整应用程序的所有部分： 检查 ，我们有1个embedded式vue应用程序，每个webapp插件，Maven运行每个webapp插件和服务器端的节点构build过程做的工作分开揭露所有的3个文件，
- 插件JS文件只包含他们想要提供的构buildvue组件和第三方依赖关系： 未选中 ，所有3个输出文件夹都包含所有的JS依赖关系。
思路
对于每个webapp插件，我们认为我们需要find一种方法来构buildwebapp插件的所有.vue文件，并从输出文件中排除所有其他依赖项。 因为我们对节点和vuejs世界是新的，我们怎么能实现呢？
谢谢你的帮助。
你可能想尝试代码分割：
代码拆分是这样一种想法，即捆绑[一个包含所有Vue.js代码的
.js文件]可以被分割成更小的文件，允许用户只需要下载他们需要的代码。（……）
代码分割Vue.js应用程序的关键是asynchronous组件。 这些是组件定义（包括其模板，数据，方法等）asynchronous加载的组件。
（……）
我们需要Webpack的帮助来dynamic加载[组件]。 （…）Webpack有一个[] import（）[方法]的实现，并将其视为代码分割点，在创buildbundle时将请求的模块放入单独的文件中。
来源： 代码拆分使用Vue.js和Webpack ，一个非常有用的指导实施代码拆分。
以下是指南的作者最终dynamic加载组件的main.js代码。 如果我正确阅读了指南，那么注册组件的方式发生了这种变化，这是实现代码拆分所需的唯一更改。 在您的Webpackconfiguration中不需要更改。
new Vue({ el: '#app', components: { ExampleAsyncComponent: () => import('./ExampleAsyncComponent.vue') /* This is the changed part. */ } });