詳解如何構(gòu)建一個(gè)Angular6的第三方npm包
不廢話直接上教程
1.建立項(xiàng)目
ng new projectname
2.創(chuàng)建第三方庫(kù)
項(xiàng)目創(chuàng)建完畢，依賴安裝完畢后
# libraryname : 第三方包名字 # prefix : 組件前綴(如 nz-zorro 的組件前都是 nz-xxx) cd projectname ng g library libraryname --prefix prefix
3.查看項(xiàng)目目錄
多出一個(gè)projects目錄,目錄里就是剛才generate的第三方library
可以看到實(shí)際和 ng new 出的項(xiàng)目無多大差別,第三包的依賴直接加入package.json中,然后依賴的Module按照常規(guī)方法加入到src/app.module.ts即可.
4.愉快的構(gòu)建自己的模塊
圖中是模塊的導(dǎo)出文件，應(yīng)該會(huì)去自動(dòng)去掃描的，如果引用時(shí)遇到問題直接從public_api.ts導(dǎo)出然后重新打包即可
5.構(gòu)建第三方包
這一步需要注意的是，打包前修改package.json中的項(xiàng)目信息，起碼version信息需要修改
#切到根目錄 cd 項(xiàng)目根目錄路徑 ng build mylibrary
看一眼打出的包
6.發(fā)布包
#切到目錄 cd dist/mylibrary #發(fā)布 npm publish
這里npm publish相關(guān)的可以自行百度
以上就是本文的全部?jī)?nèi)容，希望對(duì)大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。
相關(guān)文章
AngularJS中的Promise詳細(xì)介紹及實(shí)例代碼
這篇文章主要介紹了AngularJS中的Promise詳細(xì)介紹及實(shí)例代碼的相關(guān)資料,Promise是一種模式，以同步操作的流程形式來操作異步事件，避免了層層嵌套，可以鏈?zhǔn)讲僮鳟惒绞录枰呐笥芽梢詤⒖枷?/div> 2016-12-12
ng-repeat指令在迭代對(duì)象時(shí)的去重方法
今天小編就為大家分享一篇ng-repeat指令在迭代對(duì)象時(shí)的去重方法，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過來看看吧2018-10-10
詳解AngularJS中$http緩存以及處理多個(gè)$http請(qǐng)求的方法
$http 是 AngularJS 中的一個(gè)核心服務(wù)，用于讀取遠(yuǎn)程服務(wù)器的數(shù)據(jù)，通過本文給大家介紹AngularJS中$http緩存以及處理多個(gè)$http請(qǐng)求的方法，希望的朋友一起學(xué)習(xí)吧2016-02-02
使用AngularJS創(chuàng)建單頁(yè)應(yīng)用的編程指引
這篇文章主要介紹了使用AngularJS創(chuàng)建單頁(yè)應(yīng)用的編程指引,AngularJS是一款高人氣的JavaScript庫(kù),需要的朋友可以參考下2015-06-06
這篇文章主要介紹了Angular CLI 使用教程指南參考小結(jié)，小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧2019-04-04
angularjs實(shí)現(xiàn)的前端分頁(yè)控件示例
本篇文章主要介紹了angularjs實(shí)現(xiàn)的前端分頁(yè)控件示例，小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧2017-02-02
Angular應(yīng)用里環(huán)境變量SERVER_REQUEST_ORIGIN含義解析
這篇文章主要為大家介紹了Angular應(yīng)用里環(huán)境變量SERVER_REQUEST_ORIGIN的含義解析，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪2023-10-10
AngularJS中監(jiān)視Scope變量以及外部調(diào)用Scope方法
在AngularJS中，有時(shí)候需要監(jiān)視Scope中的某個(gè)變量，因?yàn)樽兞康母淖儠?huì)影響一些界面元素的顯示，接下來通過本文給大家介紹AngularJS中監(jiān)視Scope變量以及外部調(diào)用Scope方法，需要的朋友參考下吧2016-01-01
AngularJS實(shí)現(xiàn)單獨(dú)作用域內(nèi)的數(shù)據(jù)操作
這篇文章給大家介紹了利用AngularJs如何實(shí)現(xiàn)ng-repeat內(nèi)各個(gè)小的子作用域單獨(dú)數(shù)據(jù)綁定。有需要的小伙伴們可以參考借鑒，下面來一起看看吧。2016-09-09
angularjs學(xué)習(xí)筆記之雙向數(shù)據(jù)綁定
AngularJS在$scope變量中使用臟值檢查來實(shí)現(xiàn)了數(shù)據(jù)雙向綁定。和Ember.js數(shù)據(jù)雙向綁定中動(dòng)態(tài)設(shè)施setter和getter不同，臟治檢查允許AngularJS監(jiān)視那些存在或者不存在的變量。2015-09-09最新評(píng)論