带.JSP索引文件的Webpack

Question

所以这是一个问题，当前我正在从事一个前端与后端紧密耦合的项目。该应用程序的旧版本是使用.JSP文件构建的，索引文件是index.JSP文件。

我当前的任务是为Vue中的新前端编写一个开发环境，并使用webpack开发服务器来提供新内容，并将捆绑软件注入index.jsp文件中。那就是我陷入困境的地方，我不知道将Webpack开发服务器或HtmlWebpackPlugin脚本标签注入JSP文件的任何方法。

任何帮助将不胜感激，因为我确实对此感到困惑。

Answer 1

恐怕与Webpack捆绑（或处理）诸如JSP之类的服务器端组件并不是一个好主意。而且，我不认为webpack和加载程序/插件确实支持服务器端组件。好消息是它不是必需的，并且有中间立场。

就是说，假设Webpack可以捆绑您的全部或部分CLIENT辅助代码（JS，CSS，SCSS等），那么将JSP与Webpack一起使用的选项

选项1：使Webpack捆绑成为Maven / ant / gradle构建的一部分

• Webpack将代码捆绑到 bundle.js
• 更新您的JSP页面以bundle.js通过script标签包含此页面
• 修改您的构建（maven / ant / gradle /等），以将webpack捆绑包括在Java代码构建阶段之一中
• 在应用程序/ Web服务器中部署代码

受到限制，从某种意义上说，这在某种意义上是限制性的，即每次在CLIENT辅助代码中进行一次更改时，都必须运行完整的Java构建（maven / ant / gradle等）。这显然很耗时。

选项2：在应用程序/ Web服务器安装位置中将已部署的应用程序文件夹用于捆绑

• 在应用程序/ Web服务器内部具有webpack输出捆绑文件（可能需要运行sudo访问的webpack，具体取决于应用程序/ Web服务器env）。使用--output-pathwebpack 可以做到这一点。
• 在监视模式下运行webpack（可以根据您的方便，速度等选择开发/生产模式）

可以像往常一样继续使用CLIENT代码。无需使用传统的maven / ant / gradle构建和部署。因此，与Option1相比，此选项更好。

这就是我们一直在开发中使用的，并被证明是很好的

选项3：前面有apache，可同时为webpack开发服务器捆绑包和来自应用程序/网络服务器的JSP

只要图片中包含JSP，就不可能使用webpack开发服务器。原因：虽然webpack开发服务器将捆绑客户端代码，但是JSP由您的应用/网络服务器提供。现在，该应用程序/ Web服务器仅将静态文件部署为您的耳朵/战争的一部分。它对webpack开发服务器一无所知，它可以跟踪客户端代码并在发生更改时自动捆绑。

就是说，您可以尝试的是在前端安装apache Web服务器，然后与App Server和Webpack开发服务器进行通信。这样，当更改仅在客户端代码中时，您可以避免构建源代码。尽管Option2满足了我们的需求，但我还没有尝试过。

希望能有所帮助。

更新：添加了第二个选项，效果更好。