Angular開發必備插件一覽表

1. Angular-cli

初始化，開發，構建和維護Angular應用程序的命令行界面工具。

安裝

     npm install -g @angular/cli 

命令列表

     ng help

ng new my-first-project
cd my-first-project
ng serve

多模塊創建

• 默認創建單模塊
• 創建多模塊

ng new my-workspace --createApplication="false"
cd my-workspace
 ng generate application my-first-app
ng generate application my-second-app
ng generate library my-lib  -- 開發人員可以爲特定領域創建通用解決方案，以適合在不同應用程序中重複使用。這樣的解決方案可以作爲Angular 庫構建，並且這些庫可以作爲npm軟件包發佈和共享。

my-workspace/
  ...             (workspace-wide config files)
  projects/       (generated applications and libraries)
    my-first-app/ --(an explicitly generated application)
      ...         --(application-specific config)
      e2e/        ----(corresponding e2e tests)
         src/     ----(e2e tests source)
         ...      ----(e2e-specific config)
      src/        --(source and support files for application)
    my-lib/       --(a generated library)
      ...         --(library-specific config)
      src/        --source and support files for library)

2 Angular Console

交互式UI 間接使用Angular cli .

3.Angular Language Service

編輯器會自動檢測到您正在打開Angular文件。然後，它使用Angular Language Service來讀取tsconfig.json文件，查找應用程序中具有的所有模板，然後爲您打開的任何模板提供主要以下服務：

自動補全功能

• 可以在您鍵入內容時爲您提供上下文可能性和提示，從而可以縮短開發時間。此示例顯示了插值中的自動完成功能。輸入時，您可以點擊選項卡完成

錯誤檢查

• 警告您代碼中的錯誤

查看定義和快速定位

• 可以將鼠標懸停以查看組件，指令，模塊等的來源。然後，您可以單擊“轉到定義”或按F12鍵直接轉到定義

安裝

• vscoe 左側菜單窗格中的擴展程序圖標從編輯器中打開市場 ,輸入Angular Language Service 搜索，安裝即可。
• webstorm, package.json 中輸入以下代碼，運行npm install or yarn install 即可

         devDependencies {
                "@angular/language-service": "^6.0.0"
        }

4.Angular Follow Selector

組件標籤定位組件文件；或者樣式，定位樣式所在文件

5. Angular Files

生成Angular的文件模板（Component、Module、Pipe等等）

6. Angular 8 Snippets

html 、ts 代碼提示功能

參考文獻

Angular cli

本文由博客一文多發平臺 OpenWrite 發佈！