如何让Visual Studio支持JavaScript代码折叠功能？

本文共计900个文字，预计阅读时间需要4分钟。

前言：Visual Studio的代码折叠功能非常实用。

前言

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

文章

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

环境

Microsoft Visual Studio 2008

正文

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

　　

2. 创建一个新模块

　　

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

OptionStrictOff
OptionExplicitOff

ImportsSystem
ImportsEnvDTE
ImportsEnvDTE80
ImportsSystem.Diagnostics
ImportsSystem.Collections

PublicModuleJsMacros

SubOutlineRegions()
DimselectionAsEnvDTE.TextSelection=DTE.ActiveDocument.Selection

ConstREGION_STARTAsString="//#region"
ConstREGION_ENDAsString="//#endregion"

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


DimtextAsString=selection.Text
selection.StartOfDocument(True)

DimstartIndexAsInteger
DimendIndexAsInteger
DimlastIndexAsInteger=0
DimstartRegionsAsStack=NewStack()

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

IfstartIndex=-1AndAlsoendIndex=-1Then
ExitDo
EndIf

IfstartIndex<>-1AndAlsostartIndex<endIndexThen
startRegions.Push(startIndex)
lastIndex=startIndex+1
Else
'Outlineregion
selection.MoveToLineAndOffset(CalcLineNumber(text,CInt(startRegions.Pop())),1)
selection.MoveToLineAndOffset(CalcLineNumber(text,endIndex)+1,1,True)
selection.OutlineSection()

lastIndex=endIndex+1
EndIf
Loop

selection.StartOfDocument()
EndSub

PrivateFunctionCalcLineNumber(ByValtextAsString,ByValindexAsInteger)
DimlineNumberAsInteger=1
DimiAsInteger=0

Whilei<index
Iftext.Chars(i)=vbCrThen
lineNumber+=1
i+=1
EndIf

i+=1
EndWhile

ReturnlineNumber
EndFunction

EndModule

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

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

　　4.　　设置快捷键

　　

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

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

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

　　5.效果

　　　　5.1　　输入代码:

//aasdsadsad

//#region
//#endregion

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

　　　　

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

　　　　

结束

　　想到不如做到，但做之前要是能先Google一下也许能事半功倍: )