Creating Different Web Config Files Using Transformations

The Visual Studio development environment is rich with tools and features that allow a developer to create applications quickly. One of these features is Web.config Transformation which was shown to me by fellow developer, Jason Rivera. This enables you to automate the process of changing web.config files when deploying to different environments. You no longer need to manually change settings every time you publish to a different site.  When done manually, you leave yourself open to errors, especially with more complex config files. Without further delay, let's see how we create a Transformation.

When you expand web.config in Solution Explorer, there are by default a web.debug.config and a web.release.config.


These are fine to use but we are able to create our own config transforms with names that are relevant to our projects. Let's create a transform called Production. You will see on the tool menu at the top of Visual Studio a dropdown box that says Debug or Release in it.


Click the dropdown box and select Configuration Manager. Locate the Active solution configuration drop down and click New. In the New Solution Configuration box type in Production for the name. Since we aren't copying settings, leave the selection as <Empty> and click Ok. Close Configuration Manager. 


Right Click the Web config in Solution Explorer. Click Add Config Transform which will add the Production config file to the solution.


 Now that we created our transform, let's put some settings into our main web.config. 


I added a few app settings and a connection string to make things interesting. Next we will open the Production config and add the changes that are required when the package is deployed to our production server. 


 You will notice that they give you instructions and an example inside the config. I pasted my XML code under the comments and above system.web. The only thing I did was added "Prod" to the end of the values. After each value you add, xdt:Transform="Replace" xdt:Locator="Match(key)". In the case of the connection string you use Match(name) instead of Match(key). The Locator attribute specifies the element or elements that you want to change. The Transform attribute specifies what you want to do with the elements defined by the Locator attribute.

 When you go to deploy your project the Publish Web dialog box is displayed.


 In the Profile section, select New Profile and name it Production. Set your connection  to what you want it to be in the Connection section. In the Settings section, select Production in the Configuration dropdown. After you are done, click Publish.

Go to the folder where the app was deployed and open the web. config in Notepad. It should look something like this:


 You will notice the web.config was transformed with the properties of the Production config we created. This feature not only saves us time but protects us from the errors that can be made if we did this manually every time we changed environments. I'm sure this will be something you will use in your future projects.

Author: Christian Apostolu
Christian Apostolu's picture

Owner/founder of Crush The Soul, software developer, amateur athlete, frustrated musician. 

"Once we accept our limits, we go beyond them." - Albert Einstein