來吧，製作自己或團隊的Visual Studio(多)專案範本-Xamarin.Forms為例

來吧，製作自己或團隊的Visual Studio(多)專案範本-Xamarin.Forms為例

Installed Templates

使用Visual Studio的人一定使用過新增專案，在新增專案的過程有個步驟一定省略不了，那就是選擇你所需的專案範本，Visual Studio本身準備了非常非常豐富的專案範本，但就是有不夠用的時候，這時有二種處理方式，除了Visual Studio裡已安裝(Installed)範本外，還可以搜尋線上(Online)範本，Installed 範本大約能解決 90% 的開發需求，Online 範本能在提供 5% ~ 8% 特別需求的解決方案(但也是比較通用或一般性)，另外的 2% ~ 5% 就是今天想討論的主題，客製化自己或團隊的專案範本。

Online Templates

Xamarin.Forms (.NET Standard) 多專案範本

我們在 Xamarin.Forms 與 .NET Standard 第一集與第二集製作出了一個完全使用 .NET Standard 的 Xamarin.Forms 的專案範本，如果以 Blog 衝流量的觀點，會希望大家每次製作 Xamarin.Forms (.NET Standard) 專案時都回來看一次。不過就團隊方面來看，這很明顯是種浪費，如果能把重覆的步驟只做一次就好，似乎是一個很不錯的主意。

在 Online 範本找了一下，似乎還沒有人提供 Xamarin.Forms (.NET Standard) 範本，我就想把 Xamarin.Forms (.NET Standard) 做成專案範本提供給團隊使用，希望能達到一開即用。

製作 Visual Studio 專案範本 - (多)專案範本

製作 Visual Studio 專案範本前，我們先把要製作為範本的專案準備好。你可以從 Xamarin.Forms (.NET Standard) 專案 Fork 到我製作好的專案。

Xamarin.Forms .NET Standard Projects

製作範本的工作相當簡單，

  1. 選擇 [File] → [Export Template]
Export Template
  1. Export Template Wizard
Export Template Wizard

選擇 [Project Template] 並選擇要選擇為範本的專案。

  1. Export Template Wizard - 輸入範本資訊
Export Template Wizard Input Information

預設勾選 [Automatically import the template into Visual Studio]，那麼會在按下 [Finish] 完成之後會直接匯入 Visual Studio 的 Installed 範本內，等於就是單一專案範本製作。

預設匯出目錄在 C:\Users\{UserName}\Documents\Visual Studio 2015\My Exported Templates 你能看到一個 *.zip 壓縮檔。Visual Studio 範本檔就是一支支 .zip 檔案，我們解壓縮此 .zip 檔，應該看到如下內容：

Export Template File Unzip

我使用 7z 解壓縮，不知道為何一直會有個錯誤訊息。改用 Windows 10 本身的[解壓縮全部]則正常。

MyTemplate.vstemplate 是預設範本組態檔名稱，因為我們目標是製作多專案的範本，讓我們先修改它的名稱：NetStandard.PCL.vstemplate。接著使用你習慣的文字編輯器開啟 NetStandard.PCL.vstemplate，我們修改一下 NetStandard.PCL.vstemplate 很小量的 Metadata 內容：

<VSTemplate Version="3.0.0" xmlns="http://schemas.microsoft.com/developer/vstemplate/2005" Type="Project">
   <TemplateData>
     <Name>NETStandard.PCL</Name>
     <Description>PCL based .NET Standard 1.4</Description>
     <ProjectType>CSharp</ProjectType>
     <ProjectSubType>
     </ProjectSubType>
     <SortOrder>1000</SortOrder>
     <CreateNewFolder>true</CreateNewFolder>
     <DefaultName>NETStandard.PCL</DefaultName>
     <ProvideDefaultName>true</ProvideDefaultName>
     <LocationField>Enabled</LocationField>
     <EnableLocationBrowseButton>true</EnableLocationBrowseButton>
     <Icon>__TemplateIcon.ico</Icon>
   </TemplateData>
   <TemplateContent>
     <Project TargetFileName="tryNETStandard.csproj" File="tryNETStandard.csproj" ReplaceParameters="true">
       <ProjectItem ReplaceParameters="true" TargetFileName="App.cs">App.cs</ProjectItem>
       <ProjectItem ReplaceParameters="false" TargetFileName="GettingStarted.Xamarin">GettingStarted.Xamarin</ProjectItem>
       <ProjectItem ReplaceParameters="true" TargetFileName="project.json">project.json</ProjectItem>
       <Folder Name="Properties" TargetFolderName="Properties">
         <ProjectItem ReplaceParameters="true" TargetFileName="AssemblyInfo.cs">AssemblyInfo.cs</ProjectItem>
       </Folder>
     </Project>
   </TemplateContent>
 </VSTemplate>

<TemplateData> 段落說明此範本的內容，我們修改 <Name> 名稱與 <Description> 說明。<TemplateContent> 段落說明此範例的內容。

接下來重覆前面的步驟，匯出 *.iOS.zip 與 *.Droid.zip 範本(因為不是每個人都有 UWP 開發環境，這裡我先略過 *.UWP.zip)，解壓縮並修改 MyTemplate.vstemplate 名稱，修改 .vstemplate 的 Metadata 內容。完成所有專案的範本匯出與 *.vstemplate 修改應該有類似以下結構：

Template Projects

大腸包小腸 - Root.vstemplate

現在，你有三個專案範本，接下來我們要做合併的動作。新增指定多個專案範本的 Root.vstemplate 範本組態檔：

  1. 開一個新的 Visual Studio
  2. File → New → File...
File New File

選擇 [XML File] 點擊 Open：

New File XML File

然後貼上以下內容：

<VSTemplate Version="3.0.0" Type="ProjectGroup" xmlns="http://schemas.microsoft.com/developer/vstemplate/2005">
   <TemplateData>
     <Name>Blank App (Xamarin.Forms based .NET Standard)</Name>
     <Description>Xamarin.Forms based .NET Standard Solution Template</Description>
     <ProjectType>CSharp</ProjectType>
     <ProjectSubType>
     </ProjectSubType>
     <SortOrder>1000</SortOrder>
     <CreateNewFolder>true</CreateNewFolder>
     <DefaultName>XamarinForms_NETStandard</DefaultName>
     <ProvideDefaultName>true</ProvideDefaultName>
     <LocationField>Enabled</LocationField>
     <EnableLocationBrowseButton>true</EnableLocationBrowseButton>
     <Icon>__TemplateIcon.ico</Icon>
   </TemplateData>
   <TemplateContent>
     <ProjectCollection>
       <ProjectTemplateLink ProjectName="$projectname$.PCL">
         NETStandard.PCL\NetStandard.PCL.vstemplate
       </ProjectTemplateLink>
       <ProjectTemplateLink ProjectName="$projectname$.Droid">
         NETStandard.Droid\NETStandard.Droid.vstemplate
       </ProjectTemplateLink>
       <ProjectTemplateLink ProjectName="$projectname$.iOS">
         NETStandard.iOS\NETStandard.iOS.vstemplate
       </ProjectTemplateLink>
     </ProjectCollection>
   </TemplateContent>
 </VSTemplate>

和前面 .vstemplate 的差異主要在 <TemplateContent> 內容，單一專案主要指定 <ProjectItem> 說明要產生檔案，而多專案指定 <ProjectCollection> 的 <ProjectTemplateLink>，說明此範本會建立多個專案，而每個專案範本組態檔在各自目錄下的 *.vstemplate。

其中 ProjectName 是我希望產生出來預設專案名稱為 ProjectName.PlatformName 以方便區別，細部參數可以MSDN Template Parameters 說明。

Template Parameters 還能調整檔案內的程式碼內容，匯出範本的功能，其實也就是把特定的內容替換成 Template Parameters。你可以開啟匯出範本任一 *.cs 檔案，像命名空間應該都被換成 namespace $safeprojectname$，然後 Visual Studio 在建立專案時，再一一填入內容。

把製作好的 Root.vstemplate 儲存在三個目錄之外。

Root.vstemplate

最後一個大腸包小腸的動作，把所有解壓縮目錄與 Root.vstemplate 進行壓縮為 *.zip，這就是我們客製化多專案範本檔：

zip folders with root.vstemplate

安裝客製化多專案範本檔

vs project template location

從 Visual Studio 的 [Tool] → [Options] → [Projects and Solutions] 可以查詢到你目前 Project templates location 路徑。

將客製化多專案範本檔複製至 Project templates location 所在路徑下。至此，完成所有步驟。

copy to project tempaltes path

接下來就能使用新製作好的專案範本來新增專案：

use custom template create project

Xamarin.Forms (.NET Standard) 專案就能在點選之間完成了。

new custom template project list

iOS、Droid、UWP 專案參考問題

透過自訂專案範本新增的專案，如果有有進行專案參考，例如，PCL專案被 iOS、Droid、UWP 專案參考，那麼新增之後的平台專案會無法編譯！

pcl project references problem

原因在於平台專案範本裡的 .csproj 檔的 <ProjectReference> 段落，以 iOS 為例：

<ItemGroup>
     <ProjectReference Include="..\tryNETStandard\tryNETStandard.csproj">
         <Project>{0bd2a67a-73d0-4f7f-ae9f-22676c5cc3bb}</Project>
         <Name>tryNETStandard</Name>
     </ProjectReference>
 </ItemGroup>

它保留了原始製作樣版專案的原始參考資訊，這裡面有個麻煩的問題，那個 <Project> 的 GUID 是在專案建立時動態產生的，就匯出範本這個方法而言，並無方法可以取得這個未來值，你可以匯出範本 *.csproj 查看，每個專案都會有個獨一無二的 <ProjectGuid>{$guid1$}</ProjectGuid> 設定值，這部分就是造成參考不正常原因。

目前處理方法有二：

  • 一開始製作專案範本時，就把參考關係給移除，事後再加。
  • 事後重新加入正確的專案參考。

我查看 Visual Studio 的預設範本(C:\Program Files (x86)\Microsoft Visual Studio version\Common7\IDE\ProjectTemplates)，底層是透過 IWizard 介面 實作的範本精靈去建立專案，與匯出範本有所差異。就匯出範本方面，我沒有查到什麼解法，只好留下這小小的缺點。

系列文章：

小結與參考資料

完整專案與完整的匯出範本可以從 https://github.com/kkbruce/Xamarin.Forms-.NETStandard-Project-Templates 取得。

標籤： , , 張貼者： 於

1 則留言:

  1. 陳傳興2017年8月18日 中午12:57

    VS 2017的專案範本規範有更新，這部份我還沒時間碰...

    回覆刪除

感謝您的留言，如果我的文章你喜歡或對你有幫助，按個「讚」或「分享」它，我會很高興的。

訂閱： 張貼留言 (Atom)