让Visual Studio 也支持JS代码折叠

有两种方法，第一种是设置宏，第二种是软件。

1：宏

 

-

-

-

前言

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

文章

      1.      Using #region Directive With JavaScript Files in Visual Studio

环境

      Microsoft Visual Studio 2008

正文

      1.      打开宏资源管理器:视图 -> 其他窗口 -> 宏资源管理器
　　

2009-6-15_1.png(41.32 K)

6/25/2009 12:29:32 PM

      2.      创建一个新模块

2009-6-15_2.png(6.95 K)

6/25/2009 12:29:32 PM

　　3.　　编辑宏:　　选中模块 -> 右键编辑

Option Strict Off
Option Explicit Off

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

Public Module JsMacros

    Sub OutlineRegions()
        Dim selection As EnvDTE.TextSelection = DTE.ActiveDocument.Selection

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

        selection.SelectAll()
        '农民伯伯 --- 自动为"//#endregion"结束的代码添加最后一行，不然出错
        If selection.Text.EndsWith(REGION_END) Then
            selection.EndOfLine()
            selection.NewLine()
            selection.SelectAll()
        End If


        Dim text As String = selection.Text
        selection.StartOfDocument(True)

        Dim startIndex As Integer
        Dim endIndex As Integer
        Dim lastIndex As Integer = 0
        Dim startRegions As Stack = New Stack()

        Do
            startIndex = text.IndexOf(REGION_START, lastIndex)
            endIndex = text.IndexOf(REGION_END, lastIndex)

            If startIndex = -1 AndAlso endIndex = -1 Then
                Exit Do
            End If

            If startIndex <> -1 AndAlso startIndex < endIndex Then
                startRegions.Push(startIndex)
                lastIndex = startIndex + 1
            Else
                ' Outline region 
                selection.MoveToLineAndOffset(CalcLineNumber(text, CInt(startRegions.Pop())), 1)
                selection.MoveToLineAndOffset(CalcLineNumber(text, endIndex) + 1, 1, True)
                selection.OutlineSection()

                lastIndex = endIndex + 1
            End If
        Loop

        selection.StartOfDocument()
    End Sub

    Private Function CalcLineNumber(ByVal text As String, ByVal index As Integer)
        Dim lineNumber As Integer = 1
        Dim i As Integer = 0

        While i < index
            If text.Chars(i) = vbCr Then
                lineNumber += 1
                i += 1
            End If

            i += 1
        End While

        Return lineNumber
    End Function

End Module

 

保存即可。这里可以省去新建宏的步骤，他会根据代码自动给你生成一个宏的。

　　注意我加的代码段，如果不加，并且你的JS最后一行为#endregion，宏将报错，显示“值不在预期的范围内”。

　　4.　　设置快捷键
　　

2009-6-15_3.png(23.73 K)

6/25/2009 12:29:32 PM

　　4.1　　工具 -> 选项 - > 环境 -> 键盘

　　4.2　　在显示命令包含下面的文本框中输入宏名outli，不用输全，下面能显示你新建的宏

　　4.3　　点一下 按快捷键 下面的文本框， 然后自定义快捷键组合，我定义的是Ctrl+M,Ctrl+J，点分配(别忘了！)，点确定。

　　5.效果

　　5.1　　输入代码:
//aasdsadsad

//#region
//#endregion

　　5.2　　快捷键Ctrl+M,Ctrl+J启动宏，能看到系统的右下角显示可爱的小方块在转动，js编辑框显示效果如下：
　　　　

2009-6-15_4.png(3.22 K)

6/25/2009 12:29:32 PM

　　5.3　　之后就可以用快捷键Ctrl+M,Ctrl+L来[展开/折叠]代码了，注意关闭之后重新打开需要再启动一次宏，展开效果如下:
　　 

2009-6-15_5.png(3.48 K)

6/25/2009 12:29:32 PM

结束

 

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      选中要折叠的函数，出现如下提示
　　　　　　　　

2009-6-22_2.png(11.64 K)

6/25/2009 12:36:40 PM

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

2009-6-22_3.png(6.52 K)

6/25/2009 12:36:40 PM

                        2.2.3.3      最终效果
　　　　　　　

2009-6-22_4.png(5.88 K)

6/25/2009 12:36:40 PM