用Ant最小化JS文件的问题

Question

我使用Ant最小化我项目中的所有JS文件。它将我的各种JS文件(即:file1.js, file2.js, file3.js)编译成一个文件(即:file.min. JS)，然后将这个最小化版本与我的HTML源文件一起复制到构建文件夹中。

它工作得很好，但是复制到构建文件夹的HTML源文件仍然引用旧的未最小化版本(file1.js, file2.js等…)

所以我的问题是，当我运行Ant构建时，是否有一个函数/功能来改变HTML源代码中的任何相关文件引用?

Answer 1

最简单的方法就是始终使用最小化的JS。只要你不需要通过调试器运行你的JS或获得可理解的回溯，这就可以很好地工作。

一种叫做"源映射"的技术解决了这个问题。如果您使用源映射，则始终可以使用精简版本，并且当您需要调试时，调试器会按需加载非精简版本。不幸的是，在撰写本文(2013年3月)时，源映射非常新，并且该技术需要浏览器和minifier的支持。

如果你的HTML是从模板生成的，你最好传递一个设置到模板中，告诉它你是在构建开发还是生产，然后相应地改变标题文本。

如果上面的解决方案都不适合你，你的问题的一个hack解决方案是在你的HTML中标记单独的注释，像这样:

<!-- BEGIN DEVELOPMENT -->
<script src="src/js/file1.js"></script>
<script src="src/js/file2.js"></script>
<script src="src/js/file3.js"></script>
<!-- END DEVELOPMENT -->
<!-- BEGIN PRODUCTION
<script src="dist/js/file.js.min"></script>
     END PRODUCTION -->

然后让Ant运行一些sed脚本，注释掉开发语句并添加生产语句:

# run this command to create production version of project.html
cat src/html/project.html                                       
| sed -e 's/<!-- BEGIN DEVELOPMENT -->/<!-- BEGIN DEVELOPMENT/' 
| sed -e 's/<!-- END DEVELOPMENT -->/     END DEVELOPMENT -->/' 
| sed -e 's/<!-- BEGIN PRODUCTION/<!-- BEGIN PRODUCTION -->/'   
| sed -e 's/     END PRODUCTION -->/<!-- END PRODUCTION -->/'   
> dist/html/project.html

我建议将此命令放入shell脚本中，并让Ant使用execfile运行该脚本。在ant-contrib或其他地方也可能有第三方任务用于这种替代，但使用它们对构建您的代码的任何人来说都是一种痛苦，因为他们必须安装与您使用的相同的ant扩展。

如果你在一个没有sed的非类unix系统(即Windows)上构建，你可能可以使用gnuwin32项目中的Windows版本的sed。或者直接在Virtualbox VM中构建Linux