使用 Maven 的 JavaScript 缩小工作流程答案

【问题标题】：JavaScript minification workflow with Maven使用 Maven 的 JavaScript 缩小工作流程
【发布时间】：2023-03-30 09:57:01
【问题描述】：

我想知道将“现代 JavaScript 构建工作流程”集成到生成 WAR 工件的 Maven 构建中的任何“最佳实践”。

我发现了几个处理连接和缩小的 maven 插件：

但是我仍然想念它们如何融入完整的构建工作流程，因为我认为必须能够打开和关闭连接/缩小：

对于开发，我想构建一个不包含串联/缩小资源的 WAR，以便我可以方便地调试。对于生产版本，我想生成一个包含连接/缩小资源的 WAR。

此外，对于生产版本，我必须“重写”我的 html 中的脚本 URL 以指向脚本的连接/缩小版本。

在 JavaScript 世界中，我会将 Grunt 与不同的 grunt 任务（uglify、usemin）一起使用来实现上述工作流程。如何在 Maven 构建中实现相同的目标？

【问题讨论】：

我知道这是一个旧线程，我在一个完全不同的问题上进行了搜索。所以我读了这个问题，我认为@JamesMurphy 提供的答案是可以的，关于你在评论struggling with how can I "rewrite" my HTML so that it uses the non-minified or the minified JavaScript 中提到的第二部分，你为什么需要使用不同的文件？我会在我的 html someScritp.js 中使用它，在开发中它不会被缩小，而在生产中它会被缩小。这会是一个好的解决方案吗？
@JorgeCampos 现代前端项目的标准优化步骤是缩小、连接/捆绑和缓存破坏。对于开发，您需要细粒度的文件，而在生产中，您只需要包含所有资产（JS、CSS ...）的极少数文件。将多个文件优化为几个文件称为concatenation 或bundling。通常，您还希望通过向文件名添加哈希来“缓存”文件。这些新文件必须在您的 html 中以<script>-tags 的形式引用。在最近的项目中，我使用 WebPack，完全跳过 Maven 集成。
感谢您提供信息并提醒@jbandi :)

【解决方案1】：

既然您提到了 Grunt，您是否考虑过直接从您的 Maven 构建中调用 Grunt 任务？这不是一个完美的解决方案，但它在不依赖 Maven 插件的情况下为您提供了更多选择。 http://addyosmani.com/blog/making-maven-grunt/

【讨论】：

【解决方案2】：

您应该能够使用不同的配置文件运行 maven，这样您就可以为生产构建缩小 js 脚本，但为了调试目的使用不同的配置文件在本地构建它。

希望这会有所帮助。

【讨论】：

感谢您的回答。使用 Maven 配置文件解决了我的问题的第一部分：如何为不同的构建打开和关闭缩小。但是，我仍然在努力解决如何“重写”我的 HTML 以便它使用非缩小或缩小的 JavaScript。有没有另一个 Maven 插件呢？
您好，没问题。看起来答案已经在另一个 Stack Overflow 问题中找到了……How do you automate javascript minification for your java web applications。看起来您可以使用 YUICompressor 蚂蚁目标。您可以使用 maven-antrun-plugin 在 Maven 构建中的任何位置执行 ant 目标。我认为这应该足以让你做你想做的事。
在回答您的问题时，理论上您可以编写一个 bash 脚本来扫描您的所有 HTML 文件，如果 *.js 文件位于同一目录中，则将它们替换为 *.min.js。虽然我不知道是否有任何开箱即用的东西可以做到这一点。它可能有点定制，所以不幸的是你可能不得不自己写。
如果您使用 PHP 甚至 JSP 之类的脚本语言，您可以编写一个方法来检查是否有设置允许构建使用缩小的 js。在这种情况下，它可以根据需要在 *.js 之前加上 *.min.js。
@Dropkick：感谢您的 cmets。我仍然希望那里有更成熟的东西我还没有找到......我只是认为这应该是一个应该有标准解决方案的标准问题......