?

前言

??????上文讓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工具生成一些代碼，以及對代碼生成均有參考價值:)

?

?

?

本博Visual Studio相關文章

　　1.　　Visual Studio 讓JS也支持代碼折疊 [ Visual Studio | #region | #endregion ]

　　2.　　Visual Studio 模板 —— 自定義WebForm模板

　　3.　　用Visual Studio 2005/2008提取EXE文件中的資源[圖片|htm|光標文件]

　　4.　　Microsoft Visual Studio 2005 快捷鍵提示

　　5.　　Visual Studio 在根目錄下運行文件系統站點 [ Visual Studio | 文件系統 | WebDev.WebServer.EXE ]

?

?

?

?

?

?

總結

以上是生活随笔為你收集整理的让Visual Studio 也支持JS代码折叠 —— 续 [ Visual Studio | Js | ScriptOutline | SmallOutline ]...的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。