TypeScript環(huán)境搭建并且部署到VSCode的詳細步驟
前言:要想搭建TypeScript,那么就要有npm,要想有cnpm,那么就得有node環(huán)境。要是都有了的話,那么接下來,往下看。
TypeScript環(huán)境搭建
第一步:下載淘寶鏡像
先檢查自己有沒有成功安裝npm

有npm還不行,還要下載cnpm,命令如下(直接復制粘貼):
npm install -g cnpm --registry=https://registry.npm.taobao.org
下載好之后,會顯示成這樣。

第二步:下載TypeScript
在命令窗口輸入(直接復制粘貼):
npm install -g typescript
下載好了是這樣。

查看版本號:
tsc -v
這樣ts就完全整好了。

部署到VSCode
先創(chuàng)建一個文件夾tsDemo,
在tsDemo文件夾下創(chuàng)建一個demo.ts文件,寫上內容。。
接著,在命令窗口上跳轉到該tsDemo文件夾位置上,

然后需要在這個位置上生成一個tsconfig.json文件。
直接復制這個命令:
tsc --init
然后就會在tsDemo文件夾下生成tsconfig.json文件。
修改tsconfig.json配置
把tsDemo文件夾拖拽到vsCode上去。,找到tsconfig.json,
把我選中的這一行的注釋去掉,保存,

然后選中ts文件,點擊:終端=>運行生成任務。點擊tsc:監(jiān)聽

接著就會在終端生成js文件夾,里面有由ts文件編譯生成好的js文件。
大功告成,給自己鼓掌啊🎉🎉🎉

可能會遇到的報錯
tsc : 無法加載文件 C:\Users\JMQ\AppData\Roaming\npm\tsc.ps1,
因為在此系統(tǒng)上禁止運行腳本。有關詳細信息,請參閱
https:/go.microsoft.co m/fwlink/?LinkID=135170 中的 about_Execution_Policies。
解決方法:
以管理員身份運行vscode。

然后輸入在終端輸入:
set-executionpolicy remotesigned
就不會報錯了
ps:下面看下vscode 執(zhí)行typescript文件的方法。
1、在vscode 控制臺 執(zhí)行 tsc xxx.ts 命令轉換成 xxx.js



2、執(zhí)行 node xxx.ts 會輸出結果

到此這篇關于TypeScript環(huán)境搭建并且部署到VSCode的詳細步驟的文章就介紹到這了,更多相關TypeScript環(huán)境搭建內容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關文章希望大家以后多多支持腳本之家!
相關文章
JS 中LocalStorage和SessionStorage的使用
最近因為項目上需要使用到客戶端存儲,所以稍微研究了一下,以下說說自己的理解和使用經(jīng)驗,特此分享到腳本之家平臺,感興趣的朋友參考下吧2017-08-08
JavaScript使用Math.Min返回兩個數(shù)中較小數(shù)的方法
這篇文章主要介紹了JavaScript使用Math.Min返回兩個數(shù)中較小數(shù)的方法,涉及javascript中Math.Min方法的使用技巧,非常具有實用價值,需要的朋友可以參考下2015-04-04
JavaScript 中使用Promise.all()方法經(jīng)驗技巧詳解
這篇文章主要為大家介紹了JavaScript 中使用Promise.all()方法經(jīng)驗技巧詳解,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進步,早日升職加薪2023-10-10
javascript 用函數(shù)語句和表達式定義函數(shù)的區(qū)別詳解
本篇文章主要介紹了javascript 用函數(shù)語句和表達式定義函數(shù)的區(qū)別。需要的朋友可以過來參考下,希望對大家有所幫助2014-01-01

