首页 > 程序开发 > web前端 > JavaScript >

JS/CSS缓存杀手——VS插件

2016-07-19

JS CSS缓存杀手——VS插件

快捷输入

后来发现VS有这么一个功能,可以把代码片段拖到工具栏,点击可以自动快捷输入,效果如下,用起来非常方便,当时就想如果js和css版本号也可以有快捷的输入,大家也会更愿意去操作吧,但是因为这个内容是固定的,所以用起来还是不太方便。于是,路漫漫其修远兮,吾将上下而求索!

  \

VS插件开发---自己动手,丰衣足食

我就知道了:只要你想,就有可能。至于安装VisualStudio SDK,创建项目之类的,前面的文章已经讲得蛮多了。有兴趣的可以移步前面的文章链接哈!

 配置要修改的不多,基本就是图标、快捷键、菜单名称等。以下是我的完整配置文件




  

  

  
  

  
  

  
  
    

    
    
      
        
      
    

    
    
    
      
      
    

    
    
      
      
    
   
  
  
    
  
  
  
    
    

    
    
      
      
    

    
      
      
      
      
      
      
    
  

搭好项目,配置完成,我们开始上菜了。

小菜第一版

我们知道菜单的逻辑都在fillVersion.cs -》MenuItemCallback 中实现

第一版功能非常简单,就是简单的输入 ?v=yyyyMMddss,表面上已经实现了我的想法,确实也比原来方便多了,只要按下快捷键就完成原来多次输入的效果,代码如下

1 var dte = this.ServiceProvider.GetService(typeof(DTE)) as DTE;
2 var selection = dte.ActiveDocument.Selection as TextSelection;//当前文档中选中的部分
3 if (selection == null)
4 { 
5    return;
6 }
8 string versionstr = "?v=" + DateTime.Now.ToString("yyyyMMddss");
9 selection.Insert(versionstr, (int)vsInsertFlags.vsInsertFlagsCollapseToEnd);//重新写入文档

  效果如下:

\

但是问题来了:

A、光标一定要定位到文件名后面,这完全是在制造麻烦么?

B、我要同时给几个js添加版本号怎么办?一个个添加?这还是在制造麻烦么?

C、我要同时给js和css添加版本号又怎么办呢?

...

带着这些疑问,我开始了新的起航。

小菜最终版

在解决第一版提出的问题,首先我们得解析我们选中的内容,随便百度一下,我就发现了HtmlAgilityPack,后面的工作就简单了,便利选中script和link标签,获取href,src 属性,加个?v=yyyyMMddss 就OK了。

这个版本,我们可以直接多个标签批量设置版本号了,操作就更方便了。使用方便了,同事自然就想用了,都不用我去要求了。

直接上代码吧,大家一看就了然了,没有注释哈,代码就是最好的注释了。

 1 var dte = this.ServiceProvider.GetService(typeof(DTE)) as DTE;
 2 var selection = dte.ActiveDocument.Selection as TextSelection;//当前文档中选中的部分
 3 if (selection == null)
 4 {
 5     return;
 6 }
 7 
 8  HtmlDocument doc = new HtmlDocument();
 9  doc.LoadHtml(selection.Text);
10 
11  HtmlNodeCollection script = doc.DocumentNode.SelectNodes("//script");
12  HtmlNodeCollection link = doc.DocumentNode.SelectNodes("//link");
13 
14  string newcontent = "";
15  string versionstr = "?v=" + DateTime.Now.ToString("yyyyMMddss");
16 
17  if (link != null)
18  {
19                 foreach (HtmlNode categoryNode in link)
20                 {
21                     string href = categoryNode.Attributes["href"].Value;
22                     if (href.IndexOf("?") > 0)
23                     {
24                         href = href.Substring(0, href.IndexOf("?"));
25                     }
26                     href += versionstr;
27                     newcontent += "

再上几张最后的效果图,有图有真像,后面还有代码哦(至于最后用HJ这个图标,就是为了给媳妇邀功\\*^o^*//)。

\

\

(选择一行)

\

  (选择多行,包含link,script标签)

结语

虽然这个插件功能非常简单,但是整理这个开发的过程还是用了好几个晚上。个人觉得还是蛮实用的(至少对我们开发,还是非常有帮助的),特来分享给大家(后面有安装文件和源码)。

觉得有帮助呢,动动手指点个赞,图个高兴;觉得写得不好,也接受拍砖哈;写得不正确的地方,请不吝赐教下哈,共同进步!

相关文章
最新文章
热点推荐