feilsøking - Hvordan feilsøke Typescript i Visual Studio 2015 asp.net 5?


Finnes det en måte å feilsøke TypeScript-filer fra Visual Studio 2015 CTP6 ASP.NET 5-applikasjon? Hvis ikke, kanskje det finnes en måte å konfigurere kildekartfiler på, slik at når jeg feilsøker dem i nettleseren, kan jeg automatisk lagre endringer til mine .ts-filer på serveren? Dette kan være vanskelig, fordi .ts-filene blir kompilert av Gulp, men kanskje noen har funnet en god løsning for det?

Svar #1

Feilsøking av TypeScript med Visual Studio fungerer med de riktige innstillingene.

  1. Først må du sørge for at du lager source maps når du kompilerer TypeScript til JavaScript. Så du bør ha en xxx.js.map-fil nær hver xxx.js.

    Å få kildekart ved å kjøre TypeScript-kompilatoren utenfor Visual Studio forårsaker ingen problemer, legg til på tsc-kommandolinjen:

    --sourcemap %1.ts
    

    Ditt gulp-skript vil vanligvis opprette sourcemaps som standard.

  2. Konfigurer webapplikasjonen din i Visual Studio.

    Sett Internet Explorer som startleser. Jeg fikk det til å fungere bare med IE og tror ikke noen andre nettlesere vil fungere. (rediger: Et sted leste jeg at det finnes en Webkit-debuggingbro, så Chrome-debugging bør være mulig, men jeg husker ikke kilden.)

    Gå til fanen «Web» i prosjektets egenskaper og konfigurer seksjonen «Debuggers» nederst: Deaktiver alle debuggere! Dette er kontraintuitivt og du kan se denne feilmeldingen:

    Du har forsøkt å starte feilsøkeren, men basert på dine nåværende feilsøkingsinnstillinger på Web-egenskaper-siden er det ingen prosess å feilsøke.

    Dette oppstår når alternativet «Ikke åpne en side. Vent på en forespørsel fra en annen prosess» er valgt, og ASP.NET-feilsøking er deaktivert. Vennligst sjekk innstillingene dine på siden Web-egenskaper og prøv igjen. Som feilmeldingen sier, bør Starthandling øverst på Web-egenskapene være et annet alternativ, som «Gjeldende side».

    Sett breakpoints i din .ts-kode i Visual Studio nå eller senere.

    Trykk F5

Selv om du kan bruke Visual Studio Editor til å feilsøke og redigere .ts-filer, vil ikke «Rediger og fortsett» fungere, det finnes for øyeblikket ingen nettleser som kan laste .js og .js.map-filer på nytt og fortsette. (Korriger meg gjerne hvis jeg tar feil, så blir jeg glad.)

Svar #2

Den beste måten jeg har funnet å håndtere kartfiler på, er å inkludere kilden inne i de genererte .js-filene selv. Dette er åpenbart en løsning kun for et utviklingsmiljø.

min tsconfig.json nedenfor:

{
    "compilerOptions": {
        "noImplicitAny": false,
        "noEmitOnError": true,
        "removeComments": false,
        "target": "es5",
        "module": "system",
        "moduleResolution": "node",
        "outDir": "./wwwroot/scripts",
        "experimentalDecorators": true,
        "emitDecoratorMetadata": true,
        "inlineSourceMap": true,
        "inlineSources": true
    },
    "exclude": [
        "node_modules",
        "wwwroot"
    ]
}

Innstillingene du ser etter er inlineSourceMap og inlineSources.

Dette hjelper også med problemer forårsaket av å flytte den genererte .js til forskjellige baner og ikke måtte bekymre seg for hvor kartfilene skal gå.

Relaterte artikler