Merging Javascript for Dynamic CRM Development

SOC (Separation of Concerns) is one of the best Design Patterns that I love so much. Using this design pattern, I found it more easier for me to identified bug on my code.

When developing Javascript code on Dynamic CRM, I will separate my concerns into 3 parts:

1. Events: Bridge from Dynamic CRM event to our Javascript Business Logic.
2. Business Logic: Business logic related to your application.
3. Data Access: Handling data access.

The goal for this article is to show you that you can do separation on your Javascript but when deploying on CRM, I only want to have 1 file instead of creating multiple file.

After build, the content will merge into one file like this:

So this is tutorial how to merging multiple Javascript files into single Javascript.

1) On your project, add reference to AjaxMin nuget. After install the nuget reference on your project, put <Import Project=”ajax-min.targets” /> on your .csproject

2) After installed the reference, create new file with name ajax-min.targets on your root project. (Change the output folder to your Solution Directory folder for finding the result)

result-directory-folder is a folder after merging complete. So you need to change this configuration to the Folder that you want (Folder is must inside the Solution Folder).

3) Next step is to make a configuration file. For instance in my example, I want to merge all javascript in the LimoPayment folder, then I will create _manifest.ajaxmin.xml in the root of that folder.

Using this method, when you want to get the result. You only need to build and open your result folder to see the result.

Benefit using this method:

1. More focus when developing feature.
2. Reduce scrolling if your Javascript is very long (we break it into 3 function: DataAccess, Business, and Events).