Setting up tsconfig.json on your ASP.NET Core project for Angular 2 app

It can be bit tricky when you starting up with new technology as the approach can be different from developer and the organisation environment. Since I work in a organisation that use only Microsoft technologies and software. Our development environment lock down with firewalls and user rights. We do not have the opportunity to install most most of the opensource package management tools such as Bower, Node NPM, etc. Even we get our admins to install them we will have issue getting most of the packages as the host are been block by firewall.

Which leaves us with Visual Studio, I love Visual Studio and ReSharper combination, But nice to try out some of the latest technologies in the industry today.

Well enough with chit chat let see how we can set up the tsconfig.json in Visual Studio for your Angular 2 app.

{
  "compilerOptions": {
    "target": "es5",
    "module": "commonjs",
    "moduleResolution": "node",
    "sourceMap": true,
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "removeComments": false,
    "noImplicitAny": false,
    "rootDir": "app",
    "outDir": "wwwroot/app"
  },
  "compileOnSave": true
}

Above is the complete file but most important lines are below.

    "rootDir": "app",
    "outDir": "wwwroot/app"
  },
  "compileOnSave": true

1. rootDir defines where the TypeScript files of your app.
2. outDir defines where to copy js file output of TypeScript files of your app.
3. “compileOnSave”: true makes our life easy by telling Visual Studio to copy file on save.

that is all you need to know about this file to get started.