CODEWITHSUNDEEP
azuretypescriptangular
Frank Liu
Frank Liu

Reputation: 1586

Deploy Angular 2 App to Azure

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.

enter image description here

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.

enter image description here

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 ?

Upvotes: 6

Views: 12755

Answers (2)

user1912383
user1912383

Reputation: 369

Here are the steps i followed:

  1. make sure angular 2 app builds and runs locally
  2. Create azure web app and get the publish profile
  3. from VS publish the app by importing the downloaded publish profile
  4. Open command line from Azure --> Tools --> Kudu (or Console)
  5. cd to home\site\wwwroot
  6. execute: npm install

Upvotes: 3

Xiaomin Wu
Xiaomin Wu

Reputation: 3777

@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.

Upvotes: 3

Related Questions