作為一個 Web 應用開發者，Scaffolding Tool（腳手架工具）一定是在創建項目時的重要工具。許多開發者會習慣于使用基于 CLI 的腳手架工具來創建 Web 應用，也有許多開發者喜歡使用類似于 VS IDE 的基于 UI 的 Wizard 向導。

近期（2019 年 5 月 15 日），微軟發布了?Web Template Studio for VS Code，使得開發者在 VS Code 中可以通過基于 UI 的 Wizard 向導，快速地創建 Web 應用。

下面我們就來看看，如何使用 Web Template Studio 方便地創建 Web 應用。

打開 Web Template Studio

安裝好 Web Template Studio 后，在 VS Code 中，按下?Ctrl+Shift+P，然后輸入?Web Template Studio: Launch，按下回車，就能打開 Web Template Studio 了。

項目信息

在 Web Template Studio 首頁，輸入項目名稱和項目文件夾的路徑。

項目類型

選擇將要創建的項目類型。目前僅支持全棧 Web 應用。在未來，Web Template Studio 會考慮支持單頁應用以及 RESTful 應用。

框架

目前，Web Template Studio 支持 React 作為前端框架，Node.js/Express 作為后端框架。當然，Augular 和 Vue.js 的童鞋不要著急~ 會有更多的框架支持的，文末會提到~

頁面模板

Web Template Studio 內置了各類頁面模板，你可以選擇適合的頁面模板，來快速構建你的項目。

云服務

云計算時代已經來臨，一個好的 Web 應用當然離不開好的云計算服務。通過 Web Template Studio，你可以選擇 Azure Functions 和 Azure Cosmos DB 為你的 Web 應用添磚加瓦！

生成 Web 應用

經過前面的一系列步驟之后，點擊“Generate Template”，就能快速地生成你的 Web 應用啦！

運行 Web 應用

打開新生成的 Web 應用，根據 README 的指引，運行“yarn install”和“yarn start”，你的 Web 應用馬上就能在本地運行起來了！

更多的功能支持

通過打開 Preview Mode 的開關，你可以獲得 Angular 的支持。Web Template Studio 在短期內也將添加 Vue.js 的支持。

怎么樣？使用 Web Template Studio 來創建 Web 應用是不是很方便？趕緊來試試吧！

• 插件下載：

  https://marketplace.visualstudio.com/items?itemName=WASTeamAccount.WebTemplateStudio-dev-nightly

• GitHub：

  https://github.com/Microsoft/WebTemplateStudio

.NET社區新聞，深度好文，歡迎訪問公眾號文章匯總?http://www.csharpkit.com?

總結

以上是生活随笔為你收集整理的Web Template Studio 发布！在 VS Code 中轻松创建 Web 应用的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。