如何在vscode中使用Typescript并運行詳解
首先呢，我們在學(xué)習(xí)ts之前，需要先安裝ts
1、安裝 typescript
npm install -g typescript //檢查是否安裝 tsc -v
?2、生成配置文件，cd進入該文件夾，在控制臺輸
tsc --init
此時我們就可以看到在ts文件夾下面出現(xiàn)了 一個tsconfig.json的文件
?3、編譯ts文件
（1）第一種方法可以直接通過命令編譯
例如我們創(chuàng)建一個test.ts文件，可以在控制臺 輸入tsc +文件名 進行編譯
tsc test.ts
當(dāng)然這個操作就比較繁瑣了，那就考慮第二種方式了
（2）vscode自動化編譯ts文件
由于瀏覽器是識別不了ts文件的，因此編譯的過程就是將ts文件編譯為js文件。
如何設(shè)置呢？
第一二步如下
?第三步，點擊終端中的運行任務(wù)
?看下效果，此時我們新建一個demo.ts，控制臺就會自動監(jiān)視運行
?并在js文件夾中自動生成了對應(yīng)的demo.js文件
?此時我們對比一下，就達到了預(yù)期的目標(biāo)。
?注意：當(dāng)然第三步中運行任務(wù) 還有一個更簡便的方法，可以在該ts目錄下直接運行 tsc -w 即可運行該文件夾下所有ts文件
如何在控制臺直接運行ts，并可查看打印等輸出內(nèi)容
1、在vscode中安裝插件 Code Runner
2、安裝ts包
npm i typescript ts-node @types/node@* -g
3、點擊文件右上角的運行按鈕即可
此時就可以開啟ts的學(xué)習(xí)之路了~
總結(jié)
到此這篇關(guān)于如何在vscode中使用Typescript并運行的文章就介紹到這了,更多相關(guān)vscode使用Typescript并運行內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！
相關(guān)文章
ES6（ECMAScript 6,也稱為ES2015）是JavaScript的一個重要更新版本,引入了許多新的語言特性和改進,使得JavaScript變得更加現(xiàn)代化、易讀、易維護和更適合大型應(yīng)用程序的開發(fā),ES6的主要變化歸納為：語法糖、新機制、更好的語義、更多的內(nèi)置對象和方法2023-11-11
unapp微信小程序轉(zhuǎn)發(fā)分享及攜帶參數(shù)的2種方式
這篇文章主要給大家介紹了關(guān)于unapp微信小程序轉(zhuǎn)發(fā)分享及攜帶參數(shù)的2種方式,我們在微信小程序中經(jīng)常會使用到分享商品海報,或者是重繪微信小程序分享鏈的圖片功能,需要的朋友可以參考下2023-11-11
使用Vite創(chuàng)建一個動態(tài)網(wǎng)頁的前端項目
這篇文章主要介紹了使用Vite創(chuàng)建一個動態(tài)網(wǎng)頁的前端項目,本文通過實例代碼給大家介紹的非常詳細,對大家的學(xué)習(xí)或工作具有一定的參考借鑒價值,需要的朋友參考下吧2025-06-06
到網(wǎng)上一位別出心裁的高手使用字符串而不是正則表達式實現(xiàn)了Javascript代碼高亮顯示，自己受益匪淺，于是就構(gòu)思了CSS代碼的高亮顯示。2009-11-11
通過url傳遞參數(shù)是我們在開發(fā)中經(jīng)常用到的一種傳參方法,下面這篇文章主要給大家介紹了關(guān)于前端JS獲取URL參數(shù)的4種方法,文中通過示例代碼介紹的非常詳細,需要的朋友可以參考下2022-04-04
處于安全上的考慮，input[type="file"] 的文件選擇按鈕樣式并不能隨意修改(不過可以修改input 的透明度)，可能會跟設(shè)計師的設(shè)計格格不入，這時可以使用透明效果來自定義上傳按鈕2012-12-12
jQuery右下角旋轉(zhuǎn)環(huán)狀菜單特效代碼
jquery實現(xiàn)右下角旋轉(zhuǎn)環(huán)形菜單特效代碼，是固定在頁面右下角位置，當(dāng)用戶點擊了主菜單按鈕后，子菜單項會以環(huán)狀旋轉(zhuǎn)進入頁面，并使用animate.css制作動畫效果，有需要的朋友可以參考下2015-08-08
基于Bootstrap里面的Button dropdown打造自定義select
這篇文章主要介紹了基于Bootstrap里面的Button dropdown打造自定義select的相關(guān)資料,非常不錯具有參考借鑒價值，需要的朋友可以參考下2016-05-05
javascript獲取鼠標(biāo)點擊元素對象(示例代碼)
本篇文章主要介紹了利用javascript獲取鼠標(biāo)點擊元素對象的示例代碼。需要的朋友可以過來參考下，希望對大家有所幫助2013-12-12
這篇文章主要介紹了js判斷瀏覽器類型及設(shè)備（移動頁面開發(fā)）,需要的朋友可以參考下2015-07-07