如何在 debug 時使用對應組態設定的 web.config

自從 web.config transform (可以依不同的組態設定 e.g.: debug、release 設定不同的值) 的功能出現後，在不同環境間的變數處理變得容易許多，雖然有方法可以預覽及比較最後產出的 config 內容，但我們有時需要針對不同的組態設定來進行 debug，此時就會發現切換 Visual Studio 到不同組態(configuration)時，依舊使用預設的 web.config 執行，而非對應的 web.{組態}.config ，這是因為 web.config transform 原始設計就是只在執行 部署 時才會觸發 config 轉換的緣故，身為一個偷懶追求效率的工程師，你一定也不想為了 debug 不同組態的參數就手動修改 web.config，如果設定沒幾個就算了，一旦設定有幾十個，我想還是來看看可以怎麼設定吧

基本設定

使用預設 ASP.NET MVC 專案範本
在 web.config 加入一個 appsetting
```
<add key="yowko" value="yowko"/
```

分別修改不同組態時 web.config 的設定內容

Web.Debug.config

<appSettings>
    <add key="yowko" value="Debug" xdt:Transform="Replace" xdt:Locator="Match(key)"/>
</appSettings>

Web.Release.config

<appSettings>
    <add key="yowko" value="Release" xdt:Transform="Replace" xdt:Locator="Match(key)"/>
</appSettings>

修改 HomeController

public ActionResult Index()
{
    ViewBag.Message = ConfigurationManager.AppSettings["yowko"];
    return View();
}

修改 Index.cshtml

@{
    ViewBag.Title = "Home Page";
}
@ViewBag.Message

實際問題

切換不同 configuration 仍顯示預設 web.config 的設定

11default

預覽對應組態的 config 結果

在想要預覽的組態 config 上按右鍵 –> Preview Transform
預覽結果
分割視窗左邊是原本的 web.config，右邊是轉換後的 web.config，畫面上會用紅色表示被修改前的內容，綠色表示修改後的內容

設定 build 即觸發 web.config transform

修改 .csproj 檔

Upload Project(卸載專案)
- 專案 –> 右鍵 –> Upload Project
Edit .csproj
- 卸載的專案 –> 右鍵 –> Edit {projectname}.csproj

在設定結尾 </Project> 前加入下列設定

VS 2015

<Import Project="$(MSBuildExtensionsPath32)\Microsoft\VisualStudio\v$(MSBuildToolsVersion)\WebApplications\Microsoft.WebApplication.targets" />
<Target Name="BeforeBuild">
    <TransformXml Source="Web.template.config" Transform="Web.$(Configuration).config" Destination="Web.config" />
</Target>

VS 2017

<Import Project="$(MSBuildExtensionsPath)\Microsoft\VisualStudio\v$(MSBuildToolsVersion)\WebApplications\Microsoft.WebApplication.targets" />
<Target Name="BeforeBuild">
    <TransformXml Source="Web.template.config" Transform="Web.$(Configuration).config" Destination="Web.config" />
</Target>

VS 2017 因為安裝輕量化，有些共用元件預設沒有安裝，這個功能便是其一

儲存後重新載入專案
- 卸載的專案 –> 右鍵 –> Reload Project
複製 web.config 命名為 web.template.config
以後修改就 web.config 的內容就直接修改 web.template.config
build project 就會更新 web.config
- web.config 開啟狀態會要求重新載入

使用套件
- 安裝 Configuration Transform
  1. VS 主選單 Tools –> Extensions and Updates
  2. 在 Online tab –> 搜尋 Configuration Transform –> 安裝
- 實際使用
  - 在想要取得的組態 config 上 –> 右鍵 –> Execute transformation
  - e.g. 取得 release 的 config –> 在 web.release.config 上按右鍵執行
- VS 2017 暫無法使用 (2017/04/22)

實際效果

可以依不同的 configuration 顯示對應設定內容

心得

使用 .csproj 檔
- 優點：
- 設定一次就永久有效
- 缺點：
- 多了一個 template 檔案，容易造成新進人員混淆
- 每次 build 都會執行，會影響開發節奏
使用套件
- 優點：
- 有需要才執行，速度可控制
- 程式碼維護上比較直覺
- 缺點：
- 需要安裝套件，套件目前仍無法於 vs2017 中使用

文章目錄