How to deploy an Angular Application to IIS using Advanced Installer

ImportantThe following article uses options that are available starting with the Professional edition and project type.

This tutorial will present the required steps to deploy an Angular application to IIS using Advanced Installer.

Before doing any of the steps shown below, you have to make sure that you have specified a Base URL for your Angular application. Otherwise, you may have some difficulties during the IIS deployment. To specify the Base URL of your Angular Application build run this command in the terminal:

ng build --prod --base-href /your-app-name/

1. Adding the resource files

The first step to create the installation package is to add the application’s resources in the Files and Folders page. The application’s resources are the ones obtained after the application has been built from your IDE.

Because the content of this folder might change during the development process certain files must be included or excluded in the Advanced Installer project, making it difficult to track these changes. You can automate this step by using the folder synchronization feature from Advanced Installer. Additional information about how synchronized folders work is available in the Working with Synchronized Folders article.

In the Application Folder view from the Files and Folders page, you can create a regular folder. You can synchronize this folder with the content of the directory where your application has been built. After this step, your project's Files and Folders view should look as follows:

Helloangular folder

2. Create the Application Pool

It's good practice to make sure that your applications will run under their application pool; using the Default App Pool might prevent applications from running as expected. To create an application pool, you can use the [ New Application Pool ] toolbar button from the IIS view.

Iis settings

3. Create the application on the IIS page

Since the resources of your application have been added to the project, it is time to create the application. In the IIS view, you can create a new application using the [ New Web Application] toolbar button. When prompted, please select the previously created folder from the Application Folder view as the application’s physical folder. The application should look like this:

Iis settings config

Next, we need to enable the Use installed application pool option from the Application Pool tab and select the previously created pool.

4. Enabling the required IIS Windows Features

All we have to do is enable the IIS features using a Windows Feature Bundle. To do this, we simply use the [ New Windows Feature Bundle ] toolbar button from the Prerequisites view of Advanced Installer. We can select the Target Operating Systems for the windows feature, according to our scenario.

Prerequisites

When a new application is created in the Advanced Installer project, an IIS launch condition is automatically enabled in the Software tab from the Launch Condition page. Since we made sure that IIS is enabled on the target machine, via Windows Features, it is safe to remove the software launch condition.

5. Launch the application at the end of the installation process

If your scenario requires launching the application in a browser at the end of the installation process, you can use the predefined Open URL custom action as a custom action with a sequence:

Open url custom action