前端結合Typescript進行快速開發


這里介紹的是不使用任何的前端框架,保持初心,最簡單的做法。以下總結,使用工具Visual Studio Code。

 

第一步:創建一個package.json文件。這個可以通過 npm init命令來完成。

第二步:創建一個tsconfig.json文件。這個用來定義typescript的編譯選項。關鍵的一個設置如下,就是typeRoots這個設置。

第三步:在根目錄下創建一個typings目錄,並創建一個index.d.ts文件。在這個文件中,引用其他的d.ts文件。例如

/// <reference path="../node_modules/@microsoft/teams-js/dist/MicrosoftTeams.d.ts" />

 

這些d.ts文件,可以通過 npm install 命令來安裝標准的npm包得到。例如,如果我安裝了microsoftTeams的客戶端JS SDK(npm install @microsoft/teams-js ),就會有如下的文件。


第四步:編寫你的業務應用的前端代碼邏輯,使用ts文件。例如

在這里寫代碼時有完整的智能提示。非常舒服。

 

第五步:運行 tsc 命令生成 js文件,並且在html文件中直接應用這些js文件,例如


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM