使用 VS2010 缩小 JavaScript 并附加版本号

Posted 2023-03-31

【中文标题】使用 VS2010 缩小 JavaScript 并附加版本号

【英文标题】：Minify JavaScript and Attach Version Number using VS2010

【发布时间】：2011-12-03 00:59:28

【问题描述】：

我有几个目标想要实现，但我不确定如何实现：

为我的 Web 项目创建一个单击部署，其中包含一个缩小的 javascript 文件 版本我缩小的 JavaScript 文件，以防止在推送新版本时浏览器缓存静态内容 在 RELEASE 构建中引用版本化 JavaScript 文件，在 DEBUG 构建中引用 JavaScript 文件的非缩小版本

来自这篇文章：

http://encosia.com/automatically-minify-and-combine-javascript-in-visual-studio/

我已经添加了 JSMin 来使用这样的命令来缩小我的文件：

"$(SolutionDir)Tools\jsmin.exe" < "$(ProjectDir)Scripts\myfile.js" > "$(ProjectDir)Scripts\myfile.min.js"

我还会将此添加到我的网页中，以便在调试模式下保留非缩小文件：

    <% if (HttpContext.Current.IsDebuggingEnabled)  %>
             <script type="text/javascript" src="scripts\myfile.js"></script>
    <%  else  %>
             <script type="text/javascript" src="scripts/myfile.min.js"></script>
    <%  %>

所以我真的想弄清楚如何防止 myfile.min.js 在更新时被 Web 浏览器视为静态内容。如果我的目标不是单击部署，我可以手动添加版本号，但这似乎不是一个可靠的方法。想法？

【问题讨论】：

您可以添加查询参数进行版本控制：scripts/myfile.min.js?v=1.0 最好在 src 字符串中插入版本号。

这不是一个坏方法。您如何建议在每次部署时更新 ?v=1.0 而无需手动执行？

使用语义版本控制。每当您有主要、次要或补丁更新时，请在程序本身中增加相应的版本号。

我的团队通过 app.config 手动进行版本控制。我不同意这种方法 100%，因为你也有AssemblyInfo，你可以get version info。但是，对于每个人来说，更新 app.config 显然比 AssemblyInfo 更容易记住。

嗯，我在语义版本控制和 app.config 方法方面遇到的问题是，它是人们可能会忘记的另一件事。根据我的理解，一键部署背后的想法是，它不应该要求有人知道正确部署应用程序的所有“技巧”。

【参考方案1】：

这个答案有点晚了，但我认为这是一种相当可靠的方法，可以根据文件本身的校验和确保缓存行为与文件同步。

<script type="text/javascript" src="/Scripts/Scripts.min.js?v=<%= Utils.GetFileHash("/Scripts/Scripts.min.js") %>"></script>

在你的 Utils 类中，你有生成文件校验和的方法

public static string GetFileHash(string path)
    
        string hash = (string)HttpContext.Current.Cache["_hash_" + path];

        if (hash == null)
        
            // Get the physical path of the file
            string file = HttpContext.Current.Server.MapPath(path);

            // Code for MD5 hashing omitted for brevity
            hash = Utils.GetMD5(file); 

            // Insert the hash into the Cache, with a dependency on the underlying file
            HttpContext.Current.Cache.Insert("_hash_" + path, hash, new System.Web.Caching.CacheDependency(file));
        

        return hash;
    

这会缓存文件的hash，所以只需要在文件发生变化时计算它。

此外，CacheDependency 确保如果您要更改 .js 文件，它会确保重新生成哈希。

希望这会有所帮助，这是我在我的一个生产网站中使用的。

【参考方案2】：

与其在源代码中到处乱扔if/else，不如考虑实现一个IHttpFilter，它可以即时进行缩小。像what this article does 这样的东西应该可以很好地工作。

您的 javascript 应该是可缓存的，并且网络服务器上的缩小开销将是最小的。将其实现为 IHttpFilter 还意味着您不必添加路由或更改现有 URL，并且您可以仅在发布配置中有条件地添加 IHttpFilter，这样您仍然可以在开发期间调试您的 javascript。

至于版本控制，html 助手 (here's a link with some more info) 可以通过将版本号作为查询字符串参数很好地解决问题。如果版本参数不存在，您甚至可以让您的IHttpFilter 的调试版本抛出异常，因此您可以在添加新的 javascript 文件时提醒您使用 HTTP 帮助程序。

【参考方案3】：

我认为我有一个相对合适的答案，但非常感谢您的反馈：

Automatically update version number 在装配信息中。 在包含 JavaScript 文件时反映程序集版本号。因为我使用的是 MVC，所以我不得不使用来自 SO post 的建议，所以像这样：

脚本类型="文本/javascript" src='@Url.Content("~/Scripts/myfile.min.js?v=" + typeof(MyProject.Web.Controllers.MyController).Assembly.GetName().Version.ToString())'

对这种方法的想法？