详解如何构建一个Angular6的第三方npm包

 更新时间:2018年09月07日 11:24:20   作者:harlan  
这篇文章主要介绍了详解如何构建一个Angular6的第三方npm包,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧

不废话直接上教程

1.建立项目

ng new projectname

2.创建第三方库

项目创建完毕,依赖安装完毕后

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

3.查看项目目录

多出一个projects目录,目录里就是刚才generate的第三方library

可以看到实际和 ng new 出的项目无多大差别,第三包的依赖直接加入package.json中,然后依赖的Module按照常规方法加入到src/app.module.ts即可.

4.愉快的构建自己的模块

图中是模块的导出文件,应该会去自动去扫描的,如果引用时遇到问题直接从public_api.ts导出然后重新打包即可

5.构建第三方包

这一步需要注意的是,打包前修改package.json中的项目信息,起码version信息需要修改

#切到根目录
cd 项目根目录路径
ng build mylibrary

看一眼打出的包

6.发布包

#切到目录
cd dist/mylibrary
#发布
npm publish

这里npm publish相关的可以自行百度

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持脚本之家。

相关文章

  • AngularJS中的Promise详细介绍及实例代码

    AngularJS中的Promise详细介绍及实例代码

    这篇文章主要介绍了AngularJS中的Promise详细介绍及实例代码的相关资料,Promise是一种模式,以同步操作的流程形式来操作异步事件,避免了层层嵌套,可以链式操作异步事件,需要的朋友可以参考下
    2016-12-12
  • ng-repeat指令在迭代对象时的去重方法

    ng-repeat指令在迭代对象时的去重方法

    今天小编就为大家分享一篇ng-repeat指令在迭代对象时的去重方法,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2018-10-10
  • 详解AngularJS中$http缓存以及处理多个$http请求的方法

    详解AngularJS中$http缓存以及处理多个$http请求的方法

    $http 是 AngularJS 中的一个核心服务,用于读取远程服务器的数据,通过本文给大家介绍AngularJS中$http缓存以及处理多个$http请求的方法,希望的朋友一起学习吧
    2016-02-02
  • 使用AngularJS创建单页应用的编程指引

    使用AngularJS创建单页应用的编程指引

    这篇文章主要介绍了使用AngularJS创建单页应用的编程指引,AngularJS是一款高人气的JavaScript库,需要的朋友可以参考下
    2015-06-06
  • Angular CLI 使用教程指南参考小结

    Angular CLI 使用教程指南参考小结

    这篇文章主要介绍了Angular CLI 使用教程指南参考小结,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2019-04-04
  • angularjs实现的前端分页控件示例

    angularjs实现的前端分页控件示例

    本篇文章主要介绍了angularjs实现的前端分页控件示例,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2017-02-02
  • Angular应用里环境变量SERVER_REQUEST_ORIGIN含义解析

    Angular应用里环境变量SERVER_REQUEST_ORIGIN含义解析

    这篇文章主要为大家介绍了Angular应用里环境变量SERVER_REQUEST_ORIGIN的含义解析,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
    2023-10-10
  • AngularJS中监视Scope变量以及外部调用Scope方法

    AngularJS中监视Scope变量以及外部调用Scope方法

    在AngularJS中,有时候需要监视Scope中的某个变量,因为变量的改变会影响一些界面元素的显示,接下来通过本文给大家介绍AngularJS中监视Scope变量以及外部调用Scope方法,需要的朋友参考下吧
    2016-01-01
  • AngularJS实现单独作用域内的数据操作

    AngularJS实现单独作用域内的数据操作

    这篇文章给大家介绍了利用AngularJs如何实现ng-repeat内各个小的子作用域单独数据绑定。有需要的小伙伴们可以参考借鉴,下面来一起看看吧。
    2016-09-09
  • angularjs学习笔记之双向数据绑定

    angularjs学习笔记之双向数据绑定

    AngularJS在$scope变量中使用脏值检查来实现了数据双向绑定。和Ember.js数据双向绑定中动态设施setter和getter不同,脏治检查允许AngularJS监视那些存在或者不存在的变量。
    2015-09-09

最新评论