让Visual Studio 也支持JS代码折叠 —— 续 [ Visual Studio | Js | ScriptOutline | SmallOutline ]

前言

      上文让JS代码折叠的功能能用了,本文将对代码继续改进以期更好用、更实用,随后有介绍Visual Studio JS方面的几个插件。

 

文章

      1.      VS2003折叠代码的Micro

      2.      MSDN

      3.      Document Outline for Client Script in Visual Studio 2005

 

正文

      一、继续上文改造,主要是支持region 后面跟注释和显示注释

    1.1  效果图,这里就不贴步骤了,上文有详细的步骤。

    

    1.2  宏代码,修改上文使用的宏即可。


Option Strict Off
Option Explicit Off

Imports System
Imports EnvDTE
Imports EnvDTE80
Imports System.Diagnostics
Imports System.Collections

Public Module JsMacros

    Sub OutlineRegions()

        Const REGION_START As String = "//region"
        Const REGION_END As String = "//endregion"

        Dim selection As EnvDTE.TextSelection = DTE.ActiveDocument.Selection
        Dim startRegions As Stack = New Stack()         '堆栈
        Dim intCollapseStart As Integer = 0
        Dim intCollapseNum As Integer = 0
        Dim strLines() As String

        selection.StartOfDocument(True)
        selection.SelectAll()
        strLines = selection.Text.Split(vbCrLf)         '获取所有行

        For i = 0 To strLines.Length - 1
            If strLines(i).TrimStart.StartsWith(REGION_START) Then
                startRegions.Push(i + 1)                            '保存行号   
            End If
            If strLines(i).TrimStart.StartsWith(REGION_END) Then
                intCollapseStart = startRegions.Pop() + 1           '返回行号   
                intCollapseNum = (i + 1) - intCollapseStart + 1     '返回要折叠的行数
                selection.GotoLine(intCollapseStart)
                selection.LineDown(True, intCollapseNum)
                selection.SwapAnchor()
                selection.OutlineSection()
            End If
        Next

        selection.StartOfDocument()
    End Sub

End Module

     1.3  注意

      1.3.1.  由上文的"//#region" 、"//#endregion"修改成了本文的"//region"和"//endregion" 。

      1.3.2   如果想把"//region"这一行也隐藏掉只剩下"...",只需要将宏代码"intCollapseStart = startRegions.Pop() + 1"后面的"+1"去掉即可。遗憾的是没能弄出C# 折叠的那种效果出来。

      1.3.3  如果还想支持if for 等关键字的折叠,强烈推荐文章1,本文也是在此文的基础上修改的,改正了"//region"后面不能接注释的缺陷。

 

  二、支持JS的Visual Studio插件

            2.1      ScriptOutline      从试用的情况看来并没有折叠,但是他显示了方法大纲,且无需设置快捷键,作为插件和VS集成,同样能达到快速找到方法的目的。参照文章3。

                  2.1.1      下载插件:      http://www.geocities.com/evgenypages/ScriptOutline.zip

                  2.1.2      拷贝压缩文件中的ScriptOutline.AddIn、ScriptOutline.dll到目录 C:\Documents and Settings\<username>\My Documents\Visual Studio 2005\Addins

                        如果Addins目录没有的话自己建一个就行。

                  2.1.3      工具(Tools) -> 外部程序管理器(Add-in Manager...),勾上ScriptOutline插件,确定即可显示Script Outline窗口。

                  2.1.4      编写测试代码,效果如图:

                  

                  藉此我们可以在方法间快速切换!注意这里使用的环境是Microsoft Visual Studio 2005。

                  

            2.2      SmartOutline

                  2.2.1  下载 http://submain.com/download/smartoutline/ 输入邮箱地址点下载即可。

                  2.2.2      安装插件 SmartOutline_v1.1.msi ,下一步下一步就行。工具栏会出现SmallOutline,可能需要重启VS。

                  2.2.3      编写测试代码,依次按步骤:

                        2.2.3.1      选中要折叠的函数,出现如下提示

        

                        2.2.3.2      点击提示或输入组合快捷键 Alt+S、Alt+C ,弹出如下对话框,输入JS代码折叠后显示的注释名

         

                        2.2.3.3      最终效果

         

      2.2.4  总结

        比较之下还是这个最好用,如下优点:

        a).  不污染源代码,和C#里面写#region的效果一样。

        b).  折叠效果好,能显示折叠后代码块的注释,不需要像宏那样关掉之后重新激活。

        c).  此插件同时支持VS2005和VS2008,不仅如此,还支持C#、HTML、CSS等,可以从SmallOutline -> General -> Enable SmallOutline for the following files下面的列表里看到支持的其他文件。

 

            2.3      JavaScript Function Outliner插件 也请大家关注和支持此园友的插件 : )

 

结束      

  宏是个好东东,虽然有现成的插件用,仍然假借这个机会来学习一翻,甚至有想法通过宏来辅助ORM工具生成一些代码,以及对代码生成均有参考价值:)

 

转载:http://www.cnblogs.com/over140/archive/2009/06/22/1507564.html

时间: 2025-01-21 15:11:44

让Visual Studio 也支持JS代码折叠 —— 续 [ Visual Studio | Js | ScriptOutline | SmallOutline ]的相关文章

让Visual Studio 也支持JS代码折叠

有两种方法,第一种是设置宏,第二种是软件. 1:宏   - - - 前言       Visual Studio的代码折叠功能非常好用,#region #endregion 这个词连搜狗的词库里面都出现了(不含'#'号),可见使用频率很高,但是他不支持js的代码折叠 : ( 最近Ext用得比较多,一写就是上百行JS代码,非常不方便,想着自己写个扩展或插件什么的,意外搜到了下面的文章,已经用宏来实现了,本文可以理解为该文的简单译本,注意宏代码部分我有所改动 : ) 文章       1.     

让Visual Studio 也支持JS代码折叠 [ Visual Studio | #region | #endregion ]

前言       Visual Studio的代码折叠功能非常好用,#region #endregion 这个词连搜狗的词库里面都出现了(不含'#'号),可见使用频率很高,但是他不支持js的代码折叠 : ( 最近Ext用得比较多,一写就是上百行JS代码,非常不方便,想着自己写个扩展或插件什么的,意外搜到了下面的文章,已经用宏来实现了,本文可以理解为该文的简单译本,注意宏代码部分我有所改动 : )   文章       1.      Using #region Directive With Ja

JavaScript程序开发之JS代码放置的位置_javascript技巧

JavaScript在页面中使用,那么这些JS代码应该放在什么位置呢?下面来看一下. 一般来说有两种方式,写在界面上和使用.js文件. 1.1界面上的Head部分 可以直接放在head标签内,如下代码 <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <title>testPage</title> <script type=&quo

Javascript实现代码折叠功能_javascript技巧

一.首先定义一个JavaScript function,如下: function puckerMenu(level) { var levelLength = ('row' + level).length; var toDo = '0'; for (var iCount = 0 ; iCount < document.all.length; iCount++){ if ( document.all[iCount].id.indexOf('row' + level) > -1 &&

Notepad++插件JSTool:JS代码格式化工具

  Notepad++插件JSTool:JS代码格式化工具         我们在写Js的时候,经常需要格式化Js代码,这个时候就可以试下这款插件:JsToolNpp(以前也叫:JsMin),针对Js文件格式化效果很好,强烈推荐. 下载插件 插件 > Plugin Manager > Show Plugin Manager jstoolnpp install 安装插件 找到JsTool,选中,然后点击Install按钮,自动下载安装,重启Notepad++ 使用插件 在插件选项里面会多出一个J

js 翻页-关于图片翻页的js代码

问题描述 关于图片翻页的js代码 如下图所示的样式,js代码如何写 解决方案 爬这个网站的js效果下来不就好了,很简单,不会爬你发链接出来 解决方案二: 画了一张图的,可惜公司有限制上传不上去..艹 js需要跟布局配合,直说js你不明白的也说不清 布局: 1.外部一个div,作为展示图片的容器,position:relative ,overflow:hidden 2.里面的是ul,宽度是 div 的3倍(假设有3个图片),position:absolute 3.ul里面的li是: float:l

几种延迟加载JS代码的方法加快网页的访问速度_javascript技巧

本文介绍了如何延迟javascript代码的加载,加快网页的访问速度. 当一个网站有很多js代码要加载,js代码放置的位置在一定程度上将会影像网页的加载速度,为了让我们的网页加载速度更快,本文总结了一下几个注意点: 1.延迟加载js代码 复制代码 代码如下: <script type="text/javascript" src="" id="my"></script> <script type="text/

visual studio-关于Visual Studio执行闪现(代码执行窗口闪退)问题

问题描述 关于Visual Studio执行闪现(代码执行窗口闪退)问题 这是我的代码 看到问答解决方法(http://jingyan.todgo.com/shuma/2414656ctc.html),进入属性查看发现没有链接器,请大家帮助! 解决方案 嘛,一般执行是crtl+f5.......如果一闪而过的话可以加一个"getchar();"在return 的前面,还有,楼上的,vc这种东西就不要推荐了,最好还是gcc或者vs好一点 解决方案二: 在return 0的上面一行加sys

Visual Studio 现已支持 CMake

Visual C++ 团队在他们的官方博客上宣布 Visual Studio 现已支持 CMake. 什么是CMake? CMake 是一个跨平台的开源工具,通过抽象本地构建环境和编译器以管理建立跨多平台程序.CMake解析一个CMake脚本,作者在一个选择好的构建环境中创造并生成一个构建计划.(例如在Visual studio 项目, make 脚本, Xcode 项目中等等) CMake是一个跨平台的makefile生成工具,主要用于C和C++编程.在各种操作系统中,有很多工具可以用于编译C