Deploy Angular 2 App to Azure

Question

I am learning Angular 2 and Azure. I followed along the Angular 2 Tutorial and everything worked fine locally.

I published the app to Azure. 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 /app/main.ts file is not found.

I checked my deployed files via the "Kudu" dashboard as suggested by this question. I dont see any *.ts are deployed only the *.js and *.map.

Then I went back to Visual Studio changed the property of all *.ts file to Copy Always. After the change, I can see that the *.ts files are copied to the .\bin\app directory. However, after I republished the project to Azure (successfully again), I still ended up with the 404 error when requesting the main.ts file.

According to the this question IIS does not serve Typescript file correctly.

Firstly: How to apply suggested change on Azure to fix it?

Secondly: why do we need to use the *.ts files? Based on my understanding, the *.ts is complied into *.js. Why can't we just request the *.js files which are correctly deployed to Azure ?

Answer 1

@Frank,

use .ts file is just for demo and tutorial, it is actually suggested to run your site with .js file.

i have a sample app running which you might be able to reference a bit to see how it work.

https://github.com/shrimpy/AspMVCFileUploadSample

• Asp.net Core 1.0.0-rc1
• Angularjs 2

hope this will help.