如何執行 Angular library 的原理圖 Schematics
阿新 • • 發佈:2021-10-18
Jerry 的前一篇文章Angular 原理圖 Schematics 學習 - 動手開發一個實際的例子,已經開發好了一個可以執行的 Angular library Schematics.
本文介紹具體的執行步驟。
在工作區的根目錄下,執行庫的 ng build 命令。
ng build my-lib
確保 build 通過:
如果遇到錯誤,可以參考我的程式碼倉庫的程式碼。
以及這篇文章:解決 Angular 官網下載的 library Schematics build 出錯的辦法
然後,進入庫目錄,構建原理圖
cd projects/my-lib
npm run build
確保命令成功執行。
連結這個庫
這些庫和原理圖都已打包好了,就放在你工作區根目錄下的 dist/my-lib 資料夾中。
要執行這個原理圖,你需要把這個庫連結到 node_modules 資料夾中。在工作區的根目錄下,執行 npm link 命令,並把你的可分發庫的路徑作為引數。
執行完之後:
發現我自己的庫也出現在工作區根目錄的 node_modules 資料夾之下了:
同時,在我 Node.js 安裝目錄的 node_modules 資料夾下,也多了一個快捷方式:
最後,終於可以開始執行原理圖了。
執行命令列:
ng generate my-lib:my-service --name my-data
傳入的 name 引數值為 my-data.
從命令列列印的結果,發現 my-data.service.ts 已經建立成功了:
檔案內容如下:
對比一下我們 Schematics 裡的模板檔案:
這個例子就算執行成功了。
更多Jerry的原創文章,盡在:"汪子熙":