Otomatis kompilasi pada Simpan mentranskripsikan dalam Visual Studio kode

Dalam posting ini kita akan menyelesaikan dua masalah: 1) perintah “TSC” ini tidak diakui dalam kode terminal terpadu VS, dan 2) kompilasi tidak bekerja secara otomatis ketika menyimpan file “.TS” (Jenis Script).

Pengenalan

Hanya untuk menyusun konteks, The TypeScript memungkinkan Anda untuk menulis kode menggunakan struktur diketik kuat dan memiliki kode ini dikompilasi untuk murni JavaScript. Tje Kode Visual Studio adalah editor kode lintas platform yang dibuat oleh Microsoft.

// Versi yang digunakan dalam posting ini:
- Visual Studio, New (Vs) Kode, tahun baru: Versi 1.14.1
- Typescript: Versi 2.4.1

Itu tip yang mudah, tetapi Anda mungkin memiliki masalah jika Anda tidak tahu apa yang Anda lakukan: kasus saya :(D)

Instalasi node. js dan TypeScript

Salah satu cara untuk menginstal TypeScript adalah melalui manajer paket node. js (NPM – Manajer paket node), tetapi untuk menggunakannya, Anda butuhkan terlebih dahulu menginstal Node. js.

Setelah menginstal node, membuka terminal (perintah) dan jalankan perintah berikut untuk menginstal TypeScript:

pemasangan NPM -g typescript

Masih melalui Terminal Windows (atau Linux), menjalankan tes TypeScript dengan memeriksa versi yang diinstal. Perintah “TSC” adalah singkatan dari TypeScript compiler.

TSC -V

Masalah

Masalahnya adalah bahwa perintah “TSC” biasanya bekerja pada Terminal Windows, tetapi tidak di terminal terpadu yang datang dalam Visual Studio kode itu sendiri (Kode VS), Menampilkan galat berikut:

TSC tidak dikenali The perintah internal atau eksternal,Program beroperasi atau batch File.

Sebagai tambahan, saya tidak ingin menjalankan perintah “TSC” untuk setiap kali Anda ingin mengkompilasi file “.TS” (ekstensi untuk TypeScript). Jadi, Bagaimana untuk selalu melakukan kompilasi otomatis saat menyimpan (CTRL + S)? Itulah yang akan kita lihat selanjutnya.

Outros erros

Mencari untuk memecahkan masalah ini, ditemukan Posts mengatakan untuk menggunakan Untuk menyimpan, tetapi ini hanya didukung oleh Visual Studio 2015 dengan TypeScript > = 1.8.4 dan atom-typescript plugin. IE, tidak menggunakan Untuk menyimpan In “oleh tsconfig. JSON” Kode Studio visual, kode di bawah ini tidak akan bekerja:

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

Solusi

TSC di terpadu VS kode terminal

Pertama mari kita memecahkan masalah TSC tidak dikenali di terminal Visual Studio kode terpadu (Kode VS).

Beberapa Posting menyarankan menempatkan jalur TSC atau NPM di PATH variabel lingkungan, Tapi cara mudah untuk memecahkan ini adalah untuk membuat pemasangan “TypeScript untuk Visual Studio, yang kompatibel untuk VS Code juga.

Sekarang ya, setelah instalasi, membuka terminal Visual Studio kode terpadu, Mengetik:

// Hotkey untuk terintegrasi Visual Studio kode terminal:
Ctrl+`
// Atau gunakan menu untuk membuka terminal di Visual Studio kode:
Lihat, baru > Terminal terpadu

Coba periksa Versi TypeScript langsung ke terminal VS kode terintegrasi (Tidak pada Terminal Windows), dan itu mungkin bekerja:

TSC -V

Kompilasi otomatis saat menyimpan file .TS

Melalui terminal VS Code, Posisikan diri Anda dalam direktori skrip Anda (.TS), misalnya:

C yang CD:\wamp64wwwts

Buat file oleh tsconfig. JSON mengetik di terminal VS kode:

TSC --Init

Perhatikan bahwa file “oleh tsconfig. JSON” akan dibuat dalam “(C):\wamp64wwwts” (Direktori saat ini).

Buka oleh tsconfig. JSON dan mengaktifkan opsi “oleh sourceMap”: benar, dan menyimpan modifikasi, Dengan demikian:

  "compilerOptions": {
    /* Pilihan dasar */
    "target": "es5",                          /* Tentukan versi target ECMAScript: ES3 (standar), ES5, ES2015, 'ES2016', 'ES2017', atau ' ESNEXT '. */
    "module": "commonjs",                     /* Tentukan pembuatan kode modul: CommonJS, Amd, ' System, UMD, es2015, atau ' ESNext '. */
    // "lib": [],                             /* Tentukan file perpustakaan untuk dimasukkan dalam kompilasi:  */
    // "allowJs": benar,                       /* Izinkan file JavaScript dikompilasi. */
    // "checkJs": benar,                       /* Laporkan kesalahan dalam file. js. */
    // "jsx": "preserve",                     /* Tentukan generasi kode JSX: melestarikan, ' bereaksi-asli ', atau ' bereaksi '. */
    // "declaration": benar,                   /* Menghasilkan file '. d. TS ' yang sesuai. */
    "sourceMap": benar,                     /* Menghasilkan file '. map ' yang sesuai. */
    // "outFile": "./",                       /* Menyatukan dan memancarkan output ke file tunggal. */
    // "outDir": "./",                        /* Mengalihkan struktur output ke direktori. */
    // "rootDir": "./",                       /* Tentukan direktori root dari file input. Gunakan untuk mengontrol struktur direktori output dengan--outDir. */
    ... terus ...

Siap, Agora é só IR No terminal do VS kode e digitar o comando:

TSC -W

Este comando FICA monitorando ((ou vendo), oleh isso “W” de menonton) sebuah aplicação e qualquer alteração ada arquivos .TS, Quando Salvo, fará a imediata compilação em .Js.

That's it!

Jumlah total hits: 9221

Tinggalkan balasan

Alamat email Anda tidak akan dipublikasikan. Kolom yang harus diisi ditandai dengan *