Introduktion

Bara för att kontextualisera, den Skrivmaskin kan du skriva kod med en starkt typifierad struktur och har denna kompilerad kod till ren JavaScript. Redan den Visual Studio kod skapas en multiplatform redaktör av Microsoft.

// Versioner som används i det här inlägget:
- Visual Studio (VS) Koden: version 1.14.1
- Skrivmaskin: version 2.4.1

Detta är ett enkelt tips, men du kan få problem om du inte vet vad du gör: mitt fall :(D)

Node.js och skrivmaskin installation

Ett sätt att installera TypeScript är genom Pakethanteraren för Node.js (NPM – Nod pakethanterare), men att använda det, måste du först installera den Node.js.

Efter installerande noden, Öppna terminalen (kommandot) och kör följande kommando för att Installera TypeScript:

NPM installera -g skrivmaskin

Windows terminal (eller Linux), gör en testkörning av TypeScript genom att kontrollera den installerade versionen. Kommandot “TSC” är en förkortning för TypeScript-kompilatorn.

TSC -v

Problemet

Problemet är att kommandot “TSC” fungerat normalt i Windows terminal, men inte i integrerade terminalen som kommer släpper Visual Studio koden (VS kod), Visa följande fel:

'tsc' känns inte igen som en intern eller extern kommando,fungerande program eller batch-fil fil.

Ytterligare, Jag ville inte köra kommandot “TSC” för varje gång jag ville sammanställa en fil “.TS” (förlängning till skrivmaskin). Så, Hur den automatiska bygget att spara? (CTRL + S)? Är att vi kommer att se ytterligare.

Outros erros

Försöka lösa dessa frågor, Jag hittade inlägg säger att använda den compileOnSave, men detta endast stöds av Visual Studio 2015 med skrivmaskin > = 1.8.4 och atom-skrivmaskin plugin. IE, Det finns ingen mening med att använda compileOnSave i “tsconfig. json” Visual Studio koden, koden nedan fungerar inte:

{
   "compileOnSave": True,
   "compilerOptions": {
       "noImplicitAny" : True
   }
}

Lösning

TSC i VS integrerad Terminal kod

Först löser vi problemet med TSC inte redovisas i Visual Studio integrerad terminal koden (VS kod).

Vissa Inlägg föreslår att sätta sökvägen tsc eller npm i miljövariabeln PATH, men ett enkelt sätt att lösa detta gjorde den installationen av den “Skrivmaskin för Visual Studio“, Den er förenlig till VS koden.

Nu Ja, Efter installationen, Öppna Visual Studio integrerad terminal kod, att skriva:

// Kortkommando för Visual Studio integrerad terminal kod:
CTRL+`
// Eller Använd menyn för att öppna terminal i Visual Studio Code:
Visa > Integrerad Terminal

Prova att kontrollera den TypeScript version integrerad terminal direkt vs kod (Inte på Windows terminal), och kommer troligen att arbeta:

TSC -v

Automatisk sammanställning när du sparar en fil .TS

Terminal koden står VS i dina script katalog (.TS), till exempel:

CD C:\wamp64wwwts

Skapa filen tsconfig. json digitando ingen terminal VS kod:

TSC --init

Observera que um arquivo “tsconfig. json” Será criado em “(C):\wamp64wwwts” (diretório corrente).

Abra o tsconfig. json e habilite en opção “sourceMap”: True, e salve en modificação, ficando assim:

  "compilerOptions": {
    /* Grundläggande alternativ */
    "target": "es5",                          /* Ange ECMAScript målversionen: 'ES3' (standard), 'ES5', 'ES2015', 'ES2016', 'ES2017', eller 'ESNEXT'. */
    "module": "commonjs",                     /* Ange modul kodgenerering: 'commonjs', 'amd', 'system', 'umd', 'es2015', eller 'ESNext'. */
    // "lib": [],                             /* Ange biblioteksfiler som ska ingå i sammanställningen:  */
    // "allowJs": True,                       /* Tillåta javascript-filer som ska sammanställas. */
    // "checkJs": True,                       /* Rapportera fel i .js filer. */
    // "jsx": "preserve",                     /* Ange JSX kodgenerering: ”bevara”, ”react-native', eller 'reagera'. */
    // "declaration": True,                   /* Genererar motsvarande '. d.ts' fil. */
    "sourceMap": True,                     /* Genererar motsvarande '.map'-fil. */
    // "outFile": "./",                       /* Sammanfoga och avger utdata till en fil. */
    // "outDir": "./",                        /* Omdirigera utdata struktur till katalogen. */
    // "rootDir": "./",                       /* Ange rotkatalogen på indatafiler. Använda för att styra den utdata katalog struktur med-outDir. */
    ... fortsätter ...

Snart, nu det är bara att gå i Grand VS kod och ange kommandot:

TSC -w

Detta kommando övervakning (eller se, så “w” klocka) ansökan och eventuella förändringar i filer .TS, När Sparad, kommer den omedelbar sammanställningen på .JS.

Det är det!