專案中執行Typescript指令碼
阿新 • • 發佈:2021-08-07
場景
在開發前端過程中,在編寫一些工具類的時候,不需要頁面,所以想要通過node執行即可。
解決方案
解決方案有兩個,一個是通過ts-node
,一個是通過TS-ESNode
庫。
ts-node
網路上教程比較多。但不符合我的需要。因為我想盡可能少改動到待執行的檔案。但通過ts-node
的方法有一些問題:
- 在進行
import
時,需要修改路徑的字尾為js, - 在package.json中新增配置"type":"modules"
具體怎麼配置以及裡面的坑請參考:https://zhuanlan.zhihu.com/p/357097559
TS-ESNode
先放上github地址:https://github.com/K-FOSS/TS-ESNode
TS-ESNode對我而言最大的優勢是支援
import
語法,且不需要其他配置,下面講一下怎麼安裝及使用TS-ESNode
安裝TS-ESNode
npm install @k-foss/ts-esnode@latest
通過cli使用
# 重點是最後的檔案路徑:./src/index.ts,修改為想要執行的路徑即可
node --loader @k-foss/ts-esnode --experimental-specifier-resolution=node ./src/index.ts
通過配置Run Configurations(WebStorm)
新增一個Run Configurations
配置Node parameters和JavaScript file,內容如下:
Node parameters: --loader @k-foss/ts-esnode --experimental-specifier-resolution=node
JavaScript file: $FilePath$
解釋:
JavaScript file配置為$FilePath$
的目的是:當你在WebStorm開啟一個typescript檔案,然後選擇該配置,點選執行,會自動執行當前檔案。
執行
總結
使用TS-ESNode
相對於ts-node
更加方便,不過截止到2021-08-07號,對以下問題沒有找到解決方案:
- 用Node的方式在專案中對Typescript進行除錯