iT邦幫忙

2023 iThome 鐵人賽

DAY 22
0
Modern Web

TypeScript 啟動!系列 第 22

[Day 22] TypeScript tsconfig.json 常見設定

  • 分享至 

  • xImage
  •  

tsconfig.json 檔案的設定選項繁多,下面是一些較常見的選項及其說明:

  1. target: 指定 ECMAScript 目標版本。例如: ES3, ES5, ES2015, ES2016, ES2017, 或 ESNext

  2. module: 指定模塊程式碼生成的方式。如: CommonJS, UMD, ES6, ES2015, 或 ESNext

  3. lib: 使用的函式庫列表,例如:["ES5", "DOM", "ES6", "ScriptHost"]

  4. allowJs: 是否允許編譯 JavaScript 檔案。

  5. checkJs: 報告 JavaScript 檔案中的錯誤。

  6. jsx: 在 .tsx 檔案中支持 JSX,例如:"React"

  7. declaration: 產生相應的 .d.ts 檔案。

  8. sourceMap: 產生相應的 .map 檔案。

  9. outFile: 輸出所有檔案的位置,小心使用。

  10. outDir: 輸出目錄。

  11. rootDir: 設定根目錄。

  12. removeComments: 刪除註解,開發後應該蠻需要的。

  13. noEmit: 不產生輸出檔案,如 JavaScript 檔案,這可以讓其他能夠轉換的工具派上用場。

  14. importHelpers: 從 tslib 導入輔助工具函數。

  15. downlevelIteration: 為 ES3/5 提供完整的迭代支持,但讓舊版本支援感覺不是好事情。

  16. isolatedModules: 每個檔案作為獨立模塊。

  17. strict: 啟用所有嚴格的類型檢查選項。

  18. noImplicitAny: 在表達式和聲明上有隱式的 any 類型時報錯。

  19. strictNullChecks: 嚴格的空值檢查。

  20. strictFunctionTypes: 嚴格的函數類型檢查。

  21. strictBindCallApply: 在 bindcallapply 上使用更嚴格的檢查。

  22. strictPropertyInitialization: 嚴格的類別屬性初始化檢查。

  23. noImplicitThis: 當 this 表達式值為 any 類型的時候報錯。

  24. alwaysStrict: 以嚴格模式分析和執行。

  25. skipLibCheck: 跳過宣告函式或函式庫的類型檢查。

  26. forceConsistentCasingInFileNames: 不允許不同的大小寫對同一檔案進行操作。

  27. noUnusedLocals: 報告未使用的局部變量。

  28. noUnusedParameters: 報告未使用的參數。

  29. noImplicitReturns: 檢查函數是否有返回值。

  30. noFallthroughCasesInSwitch: 報告 switch 語句的 case 沒有 break。

  31. moduleResolution: 模塊解析策略。如 nodeclassic

  32. baseUrl: 用於解析非相對模組名稱的根目錄。

  33. paths: 模塊名稱到基於 baseUrl 的路徑的對應。

  34. esModuleInterop: 使用 ES 模塊導入 commonjs 模組。

  35. allowSyntheticDefaultImports: 允許從沒有設置默認導出的模組導入。

  36. preserveSymlinks: 保留符號連接的解析。

  37. experimentalDecorators: 使用實驗性的裝飾器特性,建議可以等穩定後再使用實驗性質的。

  38. emitDecoratorMetadata: 為裝飾器提供原數據的支持。

  39. resolveJsonModule: 允許導入 JSON 模塊。

上述 tsconfig.json 配置中常見的一部分選項。可以在 TypeScript 官方文檔中查看所有的配置選項及其詳細說明:TypeScript tsconfig.json Documentation
這邊只是簡單舉出幾個常見又好用的參數,可以看出 tsconfig.json 真的是很猛,基本上涵蓋很多常用的地方,來強化型別檢查了 嘻嘻。


上一篇
[Day 21] TypeScript 常見錯誤 II
下一篇
[Day 23] TypeScript 零售業者模擬演練
系列文
TypeScript 啟動!30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言