I suggest you ...

Please support Angular CLI sourcemaps generated in Microsoft.DotNet.Web.Spa.ProjectTemplates::2.0.0-rc2-final

This suggestion is migrated to Developer Community. Please use below link to view the current status.
https://developercommunity.visualstudio.com/content/idea/351617/please-support-angular-cli-sourcemaps-generated-in.html
I love the new ASP.NET web template with support for Angular CLI. The only issue with this I've encountered is the lack of support for integrated debugging in VS 2017. Apparently the IDE does not support the sourcemaps generated by angular-cli. (reference closed issue: https://github.com/aspnet/JavaScriptServices/issues/1474 ). Debugging works in Chrome, suggesting that the sourcemaps are valid; but not in the IDE.

168 votes
Vote
Sign in
(thinking…)
Password icon
Signed in as (Sign out)
You have left! (?) (thinking…)
Kirtlander shared this idea  ·   ·  Flag idea as inappropriate…  ·  Admin →

9 comments

Sign in
(thinking…)
Password icon
Signed in as (Sign out)
Submitting...
  • Greg commented  ·   ·  Flag as inappropriate

    +1 for this. Creating angular project with .NET core 2.0 works fine, but .NET 2.1 with the new (better) solution setup does not debug.

  • Anonymous commented  ·   ·  Flag as inappropriate

    I've been able to set a breakpoint in Chrome (under the webpack:// node), hit it, then set other breakpoints in Visual Studio. It seems that hitting the first breakpoint in Chrome is helping VS get things set up. No combination of settings in package.json ("start": "ng serve --source-map=true --eval-source-map=false",) or enabling / disabling "Generate source maps" in the property pages seems to help.

  • John Pankowicz commented  ·   ·  Flag as inappropriate

    The new SPA templates add a lot of value to developing SPAs using a Asp.Net backend. But not being able to debug Typescript in Visual Studio is a show stopper.
    I have VS Pro 15.6.4. This problem is easy to reproduce.
    Install the new SpaTemplates:
    dotnet new --install Microsoft.DotNet.Web.Spa.ProjectTemplates::2.0.0
    Create a new project
    dotnet new angular -o my-new-app
    Open the project in Visual Studio.
    Set a breakpoint on line "this.currentCount++" in file "ClientApp\src\app\app.component.ts".
    Hit F5. Navigate to "Counter" page and hit "Increment"
    Breakpoint will not be hit. The breakpoint is an open red circle and hovering shows
    "No code has been loaded for this location".

  • Frank H commented  ·   ·  Flag as inappropriate

    i think there is the same issue with webpack-cli in webpack 4. can't debug in VS 2017 IDE but can in chrome web developer

  • Stuart Smith commented  ·   ·  Flag as inappropriate

    since @angular/cli 1.5 sourcemaps are integrated into main js bundles when running ng serve - it seems visual studio is unable to pick them up.

    i can fix in development by downgrading the cli to 1.4.9 however i can't publish into production -
    angular 5 won't build without cli 1.5.

Feedback and Knowledge Base