Debugging TypeScript files outside wwwroot

Question

How should I debug TypeScript files in ASP.NET 5? Suppose solution layout as on the following picture. Notice .ts Scripts are outside wwwroot folder and compiled .js file is

Answer 1

I've stumbled across the same problem. Right now, with Visual Studio 2015 Update 1, and I managed to overcome this issue by placing the tsconfig.json at the project root with the following content (note the exclude):

{
  "compilerOptions": {
    "module": "amd",
    "noImplicitAny": false,
    "sourceMap": false,
    "target": "es5"
  },
  "exclude": [
    "wwwroot",
    "bower_components",
    "node_modules"
  ]
}

With this, you can have your task runner to copy *.ts files to the wwwroot and VS will not complain about duplicates. In fact, it will completely ignore all files beneath the paths in the exclude section.

Answer 2

I added the following action to one of my controllers, where appEnvironment is an IApplicationEnvironment injected into your controller:

#if DEBUG

[ExcludeFromCodeCoverage]
[Route("Scripts/{*pathInfo}", Order = 500)]
public IActionResult TestTypescript(string pathInfo, System.Threading.CancellationToken cancellationToken)
{
    var path = appEnvironment.ApplicationBasePath + "/Scripts/" + pathInfo;
    if (System.IO.File.Exists(path) && pathInfo.EndsWith(".ts"))
    {
        return File(path, "application/javascript");
    }
    else
    {
        return HttpNotFound();
    }
}

#endif

Conveniently, the new web servers strip out the ../ (I'm assuming for security purposes), so you don't even have to worry about having them in the Route. (Note that you need to not have a [RoutePrefix] attribute on the controller itself for these paths to work.)

Answer 3

I still have exact the same problem in Visual Studio 2015 Update 1. I solved it by using the following code snippet in Startup.cs:

public void Configure(IApplicationBuilder app, IHostingEnvironment env, IApplicationEnvironment appEnv)
{
    app.UseStaticFiles();
    if (env.IsDevelopment())
    { 
        app.UseFileServer(new FileServerOptions()
        {
            FileProvider = new PhysicalFileProvider(System.IO.Path.Combine(appEnv.ApplicationBasePath, "App")),
            RequestPath = new PathString("/App"),
        });
    }
}

All my TypeScript-Files are under /App

Answer 4

I'm using Visual studio 2015 RC and debugging for scripts outside of wwwroot folder works by default if I set internet explorer as the debug browser in visual studio.

This also gives you the opportunity to have breakpoints directly in the visual studio IDE.

Answer 5

An update with ASP.Net Core release for a good stef's answer (that won't compile now):

public void Configure(IApplicationBuilder app, IHostingEnvironment env)
{
    if (env.IsDevelopment())
    {
        app.UseFileServer(new FileServerOptions()
        {
            FileProvider = new PhysicalFileProvider(Path.Combine(env.ContentRootPath, "Scripts")),
            RequestPath = new PathString("/app"),
        });
    }
}