天天看點

如何使用 Visual Studio Code 調試 Angular Schematics 實作

調試還提供了一個機會來了解代碼(我們沒有實作的)是如何工作的。原理圖當然就是這種情況。作為 Angular 開發人員,我們在使用 Angular CLI 時肯定每天都在使用原理圖。

我們使用 CLI 建立新的工作區、項目、服務、元件、子產品、類等 - 我們很少考慮幕後發生的事情。

但是,了解原理圖的工作原理使我們能夠欣賞為我們提供如此多功能的工具。但它也有助于學習如何建立我們自己的原理圖。

當您運作/執行 Schematic 時,您正在運作一個節點程式。 我們運作的具體程式是原理圖。 是以,要開始,我們需要一個原理圖項目。

Tooling and Prerequisites

之前,我們可以使用 schema-cli 建立一個原理圖項目,我們需要確定我們的開發環境中有以下包可用。 使用 -g 安裝以下軟體包以使其全局可用。

npm install -g @angular-devkit/schematics

npm install -g @angular-devkit/schematics-cli

該工具允許我們使用原理圖集合建立新的原理圖項目。 在終端中運作 schematics 指令。

輸出是指令的選項清單。

如何使用 Visual Studio Code 調試 Angular Schematics 實作
如何使用 Visual Studio Code 調試 Angular Schematics 實作
如何使用 Visual Studio Code 調試 Angular Schematics 實作
如何使用 Visual Studio Code 調試 Angular Schematics 實作
如何使用 Visual Studio Code 調試 Angular Schematics 實作
如何使用 Visual Studio Code 調試 Angular Schematics 實作
如何使用 Visual Studio Code 調試 Angular Schematics 實作
如何使用 Visual Studio Code 調試 Angular Schematics 實作

繼續閱讀