Debug TypeScript in Chrome, 404 response

Question

I'm compiling my .TS to JavaScript and generating source maps. However, I can't debug the actual files. I have an X number of .TS files that compiles into CombinedTypescript.js with a source map that is correct.

However, when I try to access my .TS files in the Chrome Debugger, it just gives me a 404 response. The files exist in "Sources", but I can't access them or set breakpoints in CombinedTypescript.js and step through my files.

Does anyone have an idea of what the problem might be?

Answer 1

The issue you are having is most likely that IIS isn't configured to serve .ts files. You'll need to add .ts as an MIME type.

Option 1 - Edit web.config

I'd suggest doing this change so that your project will serve .ts files regardless of the environment. To do this, add an mimeMap tag to your web.config under configuration > system.webServer > staticContent like so:

<configuration>
    ...
    <system.webServer>
        <staticContent>
            <mimeMap fileExtension=".ts" mimeType="application/x-typescript" />
        </staticContent>
    </system.webServer>
</configuration>

Source

Option 2 - Configure IIS

Another option is to configure IIS to serve .ts files. Here are some resources for doing that:

• How to add an MIME type to a web site (IIS 8)
• Add MIME Type (IIS 7)
• Configure MIME Types (IIS 6)