詳解如何構(gòu)建一個(gè)Angular6的第三方npm包

發(fā)布時(shí)間：2020-08-28 16:54:04 來(lái)源：腳本之家閱讀：144 作者：harlan 欄目：web開(kāi)發(fā)

不廢話(huà)直接上教程

1.建立項(xiàng)目

ng new projectname

2.創(chuàng)建第三方庫(kù)

項(xiàng)目創(chuàng)建完畢，依賴(lài)安裝完畢后

# libraryname : 第三方包名字
# prefix : 組件前綴(如 nz-zorro 的組件前都是 nz-xxx)
cd projectname
ng g library libraryname --prefix prefix

詳解如何構(gòu)建一個(gè)Angular6的第三方npm包

3.查看項(xiàng)目目錄

詳解如何構(gòu)建一個(gè)Angular6的第三方npm包

多出一個(gè)projects目錄,目錄里就是剛才generate的第三方library

詳解如何構(gòu)建一個(gè)Angular6的第三方npm包

可以看到實(shí)際和 ng new 出的項(xiàng)目無(wú)多大差別,第三包的依賴(lài)直接加入package.json中,然后依賴(lài)的Module按照常規(guī)方法加入到src/app.module.ts即可.

4.愉快的構(gòu)建自己的模塊

詳解如何構(gòu)建一個(gè)Angular6的第三方npm包

圖中是模塊的導(dǎo)出文件，應(yīng)該會(huì)去自動(dòng)去掃描的，如果引用時(shí)遇到問(wèn)題直接從public_api.ts導(dǎo)出然后重新打包即可

5.構(gòu)建第三方包

這一步需要注意的是，打包前修改package.json中的項(xiàng)目信息，起碼version信息需要修改

#切到根目錄
cd 項(xiàng)目根目錄路徑
ng build mylibrary

詳解如何構(gòu)建一個(gè)Angular6的第三方npm包

看一眼打出的包

詳解如何構(gòu)建一個(gè)Angular6的第三方npm包

6.發(fā)布包

#切到目錄
cd dist/mylibrary
#發(fā)布
npm publish

這里npm publish相關(guān)的可以自行百度

以上就是本文的全部?jī)?nèi)容，希望對(duì)大家的學(xué)習(xí)有所幫助，也希望大家多多支持億速云。

向AI問(wèn)一下細(xì)節(jié)

猜你喜歡