CODEWITHSUNDEEP
google-chromevisual-studio-2013typescriptsource-maps
Eric
Eric

Reputation: 768

Chrome showing blank TypeScript file

I am setting up a new TypeScript project in visual studio 2013.

I have the option on my VS project to generate source maps checked. I have the option to specify root directory for typescript files and specify root directory for sourcemap files unchecked.

I have the option in Chrome Dev tools to enable JS sourcemaps checked.

At the bottom of my generated app.js file I see:

//# sourceMappingURL=app.js.map

And that file exists.

I do not see the source maps being downloaded in the network pane, and when I open the .ts file in the sources pane, I just see a blank file.

Any ideas? Thanks!

Upvotes: 18

Views: 5892

Answers (6)

Ogglas
Ogglas

Reputation: 69928

If it works on localhost but shows blank after publishing to any environment it is probably due to that the .ts-files are not included.

To include .ts-files on Debug publish add this at the bottom of the web .csproj where the other <Target Name are. If you wan't .ts-files on every publish remove Condition="'$(Configuration)'=='Debug'".

<Target Name="AddTsToContent" AfterTargets="CompileTypeScript" Condition="'$(BuildingProject)' != 'false'">
   <ItemGroup>
      <Content Include="@(TypeScriptCompile)" Condition="'$(Configuration)'=='Debug'"/>
   </ItemGroup>
</Target>

Source: How to include TypeScript files when publishing?

Upvotes: 0

Vadim T
Vadim T

Reputation: 1

Add MIME to web.config: OR IIS.

Upvotes: 0

chrisco512
chrisco512

Reputation: 629

Place this in your web.config to serve up the TS files: 

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

Upvotes: 19

Daryl
Daryl

Reputation: 18895

I had a similar issue, finally figured out that I had listed a SourceUrl 

//# sourceURL=CommonLib.js

at the bottom of my Ts Script, which caused the folder of the Map and Ts file to be different.

Upvotes: 0

Marcus
Marcus

Reputation: 445

Cordle's answer worked for me, but I also needed to remove the existing MIME map for .ts.

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

The default MIME map for .ts files was "video/vnd.dlna.mpeg-tts".

Upvotes: 6

Eric
Eric

Reputation: 768

I figured out what was going on. I needed to add a mime map for the extension .ts either in IIS or in my web.config. So the browser was asking for the TypeScript file but not getting anything back, therefore it showed up blank.

Upvotes: 3

Related Questions