原文 : " A Visual Studio to Visual Studio Code Snippet Converter" 作者 : "Rick Strahl" 譯者 : "張蘅水" 導語 和原文作者一樣，水弟我現在也是使用 VS Code 和 Rider 作為主力開發工具，尤其是 VS Cod ...
原文 : A Visual Studio to Visual Studio Code Snippet Converter
作者 : Rick Strahl
譯者 : 張蘅水
導語
和原文作者一樣，水弟我現在也是使用 VS Code 和 Rider 作為主力開發工具，尤其是 VS Code 可以跨平臺，又有豐富的插件支持和多種編程語言支持。當我從 VS 轉移到以 VS Code 的開發過程中，遇到的最大問題就是代碼提示的不完善（被 VS 和 R# 調教壞了，總想按 tab 鍵）。當我看到原文作者通過從 VS 中導出代碼片段到 VS Code 時，瞬間被吸引到了。 雖然在不知不覺中用了 VS 自帶的代碼片段，但我從來沒有想過要自定義專屬的代碼片段，最多也是製作用於項目的模板（方便創建特定的類型文件）。雖然導出到 Rider 不是很完美，但 Rider 自帶了 R#，對這方面的需求還是很少的。
譯文：
Visual Studio 內置了非常好用的代碼片段工具，多年來我一直在使用它來創建大量有用的擴展片段，使我的日常開發更容易。我有很多 C# 代碼片段，但更多的是用於 HTML 、自定義的 Bootstrap 代碼片段，乃至複雜的 HTML 控制項代碼段。偶爾也會用到 JavaScript 、XAML 甚至Powershell 。
在過去的幾年裡，我越來越多地使用其他工具與 Visual Studio 結合使用。特別是Visual Studio Code和JetBrains Rider。
在多年的使用 Visual Studio 中，我已經累積了 130 多個代碼片段。每當我在其他開發環境中工作時 ( VS Code 或者 Rider)，我真的很需要他們，特別是要寫一大段 HTML的時候，總是要去痛苦地去對應的文檔站點查找。使用代碼片段功能，只需幾次擊鍵就會自動填充我自定義的特定代碼，每天可節省大量時間。
所以我很需要代碼片段功能，有時我打開 Visual Studio 只是為了找到需要的 HTML 的代碼片段，然後將它們粘貼回 VS Code 或 Rider。雖然繁瑣，但是仍然從文檔網站中複製代碼，然後手動修改代碼來得便捷。如果能在每個對應的開發環境中直接執行代碼片段的功能，那就太好了！
因此，在過去的幾個周末，我做了一個將 Visual Studio 中的代碼片段導出到 VS Code 中的小工具，同時儘量能導出到 JetBrains Rider 。
如果你感興趣，可以在GitHub上找到代碼：
另外說一句，這還只是一個菜鳥項目，並不能保證它支持所有類型的的代碼片段。只是我自己擁有的 137 個代碼片段都完美地移植到 VS Code，並且能夠運行。同時我還可以重新導出， 輕鬆地導出新創建的代碼片段，這樣就可以對比和更新了。
對於 Rider 而言，操作起來更為複雜，因為 Rider 有一種瘋狂的機制，可以將模板存儲在內部的單個配置文件中。它還為 .NET相關的片段 (C#、VB、F＃、Razor、ASP.NET ）和 基於 Web ( html、css、js 等）的代碼片段使用了多個完全不同的存儲引擎。所以工具目前僅支持一次性導出 .NET 相關代碼段，因為 Rider 中基於 GUID 的密鑰系統不允許在沒有 GUID 的情況下查找現有代碼段。後面我們再詳細介紹。
代碼片段轉換器
你可以通過藉助 .NET 全局工具 (.NET Global SDK Tool )，使用 Nuget 下載和運行代碼片段轉換器：
dotnet tool install --global dotnet-snippetconverter如果您不想安裝並只運行該工具，您可以克隆或下載Github倉庫，然後：
cd .\SnippetConverter\
dotnet run安裝後， 可以通過指向文件夾或單個文件將 Visual Studio 中的代碼片段批量或單獨轉換為 VS Code 支持的代碼片段。
snippetconverter ~2017 -r -d或者，您可以像下麵這張屏幕截圖那樣指定輸出文件：
有幾個選項可用於轉換單個片段和文件夾，使用首碼，遞歸文件夾，輸出生成文件的路徑等：
Syntax:
-------
SnippetConverter <sourceFileOrDirectory> -o <outputFile>
--mode --prefix --recurse --display
Commands:
---------
HELP || /? This help display
Options:
--------
sourceFileOrDirectory Either an individual snippet file, or a source folder
Optional special start syntax using `~` to point at User Code Snippets folder:
~ - Visual Studio User Code Snippets folder (latest version installed)
~2017 - Visual Studio User Code Snippets folder (specific VS version 2019-2012)
-o <outputFile> Output file where VS Code snippets are generated into (ignored by Rider)
Optional special start syntax using `~` to point at User Code Snippets folder:
%APPDATA%\Code\User\snippets\ww-my-codesnippets.code-snippets
~\ww-my-codesnippets.code-snippets
if omitted generates `~\exported-visualstudio.code-snippets`
-m,--mode vs-vscode (default)
vs-rider experimental - (C#,VB.NET,html only)
-d display the target file in Explorer
-r if specifying a source folder recurses into child folders
-p,--prefix snippet prefix generate for all snippets exported
Example: `ww-` on a snippet called `ifempty` produces `ww-ifempty`
Examples:
---------
# vs-vscode: Individual Visual Studio Snippet
SnippetConverter "~2017\Visual C#\My Code Snippets\proIPC.snippet"
-o "~\ww-csharp.code-snippets" -d
# vs-vscode: All snippets in a folder user VS Snippets and in recursive child folers
SnippetConverter "~2017\Visual C#\My Code Snippets" -o "~\ww-csharp.code-snippets" -r -d
# vs-vscode: All the user VS Snippets and in recursive child folders
SnippetConverter ~2017\ -o "~\ww-all.code-snippets" -r -d
# vs-vscode: All defaults: Latest version of VS, all snippets export to ~\visualstudio-export.code-snippets
SnippetConverter ~ -r -d --prefix ww-
# vs-rider: Individual VS Snippet
SnippetConverter "~2017\proIPC.snippet" -m vs-rider -d
# vs-rider: All VS Snippets in a folder
SnippetConverter "~2017\Visual C#\My Code Snippets" -m vs-rider -d上面的用例應該足夠說明用途了。如果還想要瞭解更多信息，請接著往下看......
什麼是 VS Code 的代碼片段
如果您不熟悉或不使用代碼片段，那您並不是少數人。它們在 Visual Studio 中幾乎是一個隱藏的功能，這是一個恥辱，因為它們是非常有用的生產力工具。不幸的是，Visual Studio 沒有任何有用的內置UI來創建這些片段，因此大多數開發人員都沒有充分利用此功能。Visual Studio 只能蹩腳地點擊 ** 工具 - > 代碼片段管理器 ** 菜單 ，除了一個查看器之外，它沒有其他管理功能，僅僅是查看哪些片段是可用的，沒有內置的方法來創建或編輯片段，甚至跳轉到並查看代碼片段。
但是，代碼片段僅僅只是位於用戶目錄的 Documents 文件夾下的 XML 文件。它們非常容易創建和更新，僅僅是原始的 XML 文件，用 VS Code 等文本編輯器去做代碼片段和高亮實在是非常簡單。儘管在 Visual Studio 中有一些提供 UI 操作的劣質插件，但它們往往比原始的代碼片段文件更麻煩。
創建新代碼段的最佳方法是複製現有代碼段並對其進行修改以滿足您的需求。
一般來說，代碼片段位於 (水弟我是直接用 Everything搜索的)：
<Documents>\Visual Studio 2017\Code Snippets每種語言技術都有自己的子文件夾進行分組，但僅僅是文件夾上的區分而已。代碼片段實際上通過 XML中的 Language 屬性確定它們適用的語言。
Visual Studio在此位置附帶了許多代碼段，您可以使用這些代碼段作為新代碼段的模板進行學習。
<?xml version="1.0" encoding="utf-8"?>
<CodeSnippets xmlns="http://schemas.microsoft.com/VisualStudio/2005/CodeSnippet">
<CodeSnippet Format="1.0.0">
<Header>
<Title>Property with INotifyPropertyChange raised</Title>
<Description>Control Property with Attributes</Description>
<SnippetTypes>
<SnippetType>Expansion</SnippetType>
</SnippetTypes>
<Shortcut>proIPC</Shortcut>
</Header>
<Snippet>
<References />
<Imports />
<Declarations>
<Literal Editable="true">
<ID>name</ID>
<Type></Type>
<ToolTip>Property Name</ToolTip>
<Default>MyProperty</Default>
<Function></Function>
</Literal>
<Literal Editable="true">
<ID>type</ID>
<Type></Type>
<ToolTip>Property Type</ToolTip>
<Default>string</Default>
<Function></Function>
</Literal>
</Declarations>
<Code Language="csharp" Kind="method decl" Delimiter="$"><![CDATA[public $type$ $name$
{
get { return _$name$; }
set
{
if (value == _$name$) return;
_$name$ = value;
OnPropertyChanged(nameof($name$));
}
}
private $type$ _$name$;
]]></Code>
</Snippet>
</CodeSnippet>
</CodeSnippets>一旦文件存在或更新了，Visual Studio 無需重啟，就能立即發現並使用。在相關的 (如 C#) 編輯器中，立馬就能看到智能提示中的代碼段：
它插入對應的模板並允許您編輯在模板中聲明的 $expr$ 占位符：
這個 C# 代碼片段示例， 是 VS 中最常見的語言。如您所見， XML文件中的 <Code> 節點定義模板文本，Shortcut 節點定義觸發提示的按鍵，你可以使用在 <Declaration> 節點中使用類似 $txt$ 占位符來定義參數，同樣的占位符在多個地方出現也能同步更改。
對於我來說，最有用和最常用的代碼片段時用於插入 HTML 代碼，特別是在定義 Bootstrap 結構或其他很難記住語法的自定義控制項。我喜歡在瀏覽文檔網站後創建一個對應的片段，這樣就很方便使用。用多幾次，省下來的時間就賺翻了。花費幾分鐘設置模板可以節省大量時間去輸入重覆代碼，尤其是您每次都要浪費時間查找相同的 Bootstrap 代碼時。
