title: Deploy Angular 2 App to Azure
body: <p>I am learning Angular 2 and Azure. I followed along the <a href="https://angular.io/docs/ts/latest/tutorial/" rel="nofollow noreferrer">Angular 2 Tutorial</a> and everything worked fine locally. </p>
  
  <p>I published the <a href="https://learnangular2.azurewebsites.net/" rel="nofollow noreferrer">app to Azure</a>. The publication was successfully. But when I visit the site it stuck at the loading stage. Looking at logs in the Chrome console I see the following error. The <code>/app/main.ts</code> file is not found. </p>
  
  <p><a href="https://i.stack.imgur.com/L4zVI.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/L4zVI.png" alt="enter image description here"></a></p>
  
  <p>I checked my deployed files via the "Kudu" dashboard as suggested by <a href="https://stackoverflow.com/questions/26382334/is-there-a-way-to-view-deployed-files-in-azure">this question</a>. I dont see any <code>*.ts</code> are deployed only the <code>*.js</code> and <code>*.map</code>. </p>
  
  <p><a href="https://i.stack.imgur.com/Qf9eR.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/Qf9eR.png" alt="enter image description here"></a> </p>
  
  <p>Then I went back to Visual Studio changed the property of all <code>*.ts</code> file to <code>Copy Always</code>. After the change, I can see that the <code>*.ts</code> files are copied to the <code>.\bin\app</code> directory. However, after I republished the project to Azure (successfully again), I still ended up with the 404 error when requesting the <code>main.ts</code> file. </p>
  
  <p>According to the <a href="https://stackoverflow.com/questions/16601545/include-typescript-files-in-azure-git-deploy">this question</a> IIS does not serve Typescript file correctly. </p>
  
  <p><strong>Firstly</strong>: How to apply suggested change on Azure to fix it? </p>
  
  <p><strong>Secondly</strong>:  why do we need to use the <code>*.ts</code> files? Based on my understanding, the <code>*.ts</code> is complied into <code>*.js</code>. Why can't we just request the <code>*.js</code> files which are correctly deployed to Azure ? </p>