Automàtica compilar al desar TypeScript a codi Visual Studio

En aquest Post ens resoldrà dos problemes: 1) comanda “TSC” no es reconeix en el codi de terminal integrat VS, i 2) compilació no funciona automàticament quan fitxer “.TS” (Tipus d'escriptura).

Introducció

Només per contextualitzar, la Resultant li permet escriure codi utilitzant una estructura fortament mecanografiats i tenir aquest codi compilat per pura JavaScript. Ja el Codi Visual Studio és un editor multiplataforma creat per Microsoft.

// Versions utilitzades en aquest Post:
- Estudi Visual (CONTRA) Codi: versió 1.14.1
- Resultant: versió 2.4.1

Aquest és un Consell fàcil, però vostè pot tenir problemes si no saps el que estàs fent: meu cas :(D)

Instal·lació node.js i TypeScript

Una de les maneres d'instal·lar el TypeScript és mitjançant el gestor de paquets de Node.js (NGP – Director de paquet de node), però per utilitzar-lo, primer haureu instal·lar la Node.js.

Després d'instal·lar el Node, Obrir el terminal (comanda) i dirigeixi la comanda següent a instal·lar el TypeScript:

Instal·lar NGP -resultant de g

El terminal de Windows (o Linux), fer una cursa de prova del TypeScript marcant la versió instal·lada. L'ordre “TSC” és un acrònim per TypeScript compilador.

TSC -v

Problema

El problema és que l'ordre “TSC” funcionava normalment en el terminal de Windows, però no a la terminal integrat que ve dins el codi Visual Studio (Codi VS), mostrant l'error següent:

'tsc' no es reconeix la una comanda interna o externa,arxiu de programa o grup factible arxiu.

A més a més, No volia córrer la comanda “TSC” per cada vegada que volia compilar un arxiu “.TS” (extensió a TypeScript). Tan, Com fer la complexió automàtic per estalviar (CTRL + S)? És que veurem més.

Altres errors

Que busquen resoldre aquestes qüestions, Trobava correus dient a utilitzar la compileOnSave, però això només és compatible amb Visual Studio 2015 amb TypeScript > = 1.8.4 i l'Àtom-resultant plugin. I.E., Hi ha punt en l'ús compileOnSave en “tsconfig. json” el codi d'estudi Visual, el codi de sota no funcionarà:

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

Solució

TSC en el VS integrat Terminal codi

En primer lloc, podem resoldre el problema de TSC no ser reconegut en el codi de Visual Studio integrat terminal (Codi VS).

Alguns Correus Suggerim posar el camí del tsc o NGP en la variable d'entorn PATH, però una manera fàcil de resoldre això estava fent el instal·lació de la “Resultant per a Estudi Visual, És compatible el codi VS.

Ara sí, Després d'instal·lació, Obert del Visual Studio integrat codi terminal, mecanografia:

// Clau de drecera per a Estudi Visual integrat codi terminal:
CTRL+`
// O utilitzeu el menú d'obrir el terminal en codi Visual Studio:
Veure > Terminal integrat

Proveu de comprovar la Versió resultant directe vs codi integrat terminal (No en el terminal de Windows), i probablement estarà treballant:

TSC -v

Compilació automàtica en desar un fitxer .TS

Pelo terminal no fer VS codi es posicione diretório fer seu guió (.TS), per exemple:

CD C:\wamp64wwwts

Crie o arquivo tsconfig. json digitando cap VS terminals codi:

TSC --init

Tingueu en compte el MU arquivo “tsconfig. json” em de será criado “(C):\wamp64wwwts” (diretório corrente).

Abra o tsconfig. json e habilite un opção “sourceMap”: veritable, Bàlsam e un modificação, ficando assim:

  "compilerOptions": {
    /* Opcions bàsiques */
    "target": "es5",                          /* Especificar ECMAScript versió: 'ES [3]' (per defecte), 'ES5', 'ES2015', 'ES2016', 'ES2017', o 'ESNEXT'. */
    "module": "commonjs",                     /* Especifiqueu la generació de codi mòdul: 'commonjs', "amd", "sistema", 'umd', 'es2015', o 'ESNext'. */
    // "lib": [],                             /* Especificar biblioteca arxius per ser inclòs en la compilació:  */
    // "allowJs": veritable,                       /* Permeten arxius javascript ser compilades. */
    // "checkJs": veritable,                       /* Informe d'errors en arxius. js. */
    // "jsx": "preserve",                     /* Especifiqueu la generació de codi JSX: "preservar", 'nadius reaccionen', o "reaccionar". */
    // "declaration": veritable,                   /* Genera corresponent '. arxiu dels d.ts. */
    "sourceMap": veritable,                     /* Genera el fitxer corresponent '. map'. */
    // "outFile": "./",                       /* Concatenar i emeten sortida a filera. */
    // "outDir": "./",                        /* Estructura de sortida de redirigir al directori. */
    // "rootDir": "./",                       /* Especifiqueu el directori arrel d'arxius d'entrada. Utilitzar per controlar la sortida directori estructura amb-outDir. */
    ... continua ...

Preparat, ara és només cal anar a Grand VS codi i ingressi a la comanda:

TSC -w

Aquesta ordre és la vigilància (o veure, Així “w” veure) l'aplicació i els canvis en els arxius .TS, Quan desen, es la compilació immediata en .JS.

Això és tot!

Visites totals: 1118

Deixi una contestació

La vostra adreça electrònica no es publicarà. Els camps marcats amb *