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


Posted in Javascript onSeptember 07, 2018

不废话直接上教程

1.建立项目

ng new projectname

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

2.创建第三方库

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

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

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

3.查看项目目录

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

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

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

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

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

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

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

5.构建第三方包

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

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

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

看一眼打出的包

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

6.发布包

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

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

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

Javascript 相关文章推荐
用Javascript 和 CSS 实现脚注(Footnote)效果
Sep 09 Javascript
Javascript实现仿WebQQ界面的“浮云”兼容 IE7以上版本及FF
Apr 27 Javascript
基于jquery实现的类似百度搜索的输入框自动完成功能
Aug 23 Javascript
关于js遍历表格的实例
Jul 10 Javascript
JavaScript实现Base64编码转换
Apr 23 Javascript
Javascript打印局部页面实例
Jun 21 Javascript
JavaScript如何获取到导航条中HTTP信息
Oct 10 Javascript
使用 vue.js 构建大型单页应用
Feb 10 Javascript
node 使用 async 控制并发的方法
May 07 Javascript
JS实现贪吃蛇游戏
Nov 15 Javascript
JavaScript实时更新当前的时间的示例代码
Jul 15 Javascript
解决ant design vue中树形控件defaultExpandAll设置无效的问题
Oct 26 Javascript
vue2.0 可折叠列表 v-for循环展示的实例
Sep 07 #Javascript
Js中使用正则表达式验证输入是否有特殊字符
Sep 07 #Javascript
vue.js+element-ui动态配置菜单的实例
Sep 07 #Javascript
详解npm 配置项registry修改为淘宝镜像
Sep 07 #Javascript
vue 点击按钮实现动态挂载子组件的方法
Sep 07 #Javascript
关于JavaScript中高阶函数的魅力详解
Sep 07 #Javascript
npm配置国内镜像资源+淘宝镜像的方法
Sep 07 #Javascript
You might like
PHP zlib扩展实现页面GZIP压缩输出
2010/06/17 PHP
php获取post中的json数据的实现方法
2011/06/08 PHP
php定界符
2014/06/19 PHP
PHP+jQuery 注册模块开发详解
2014/10/14 PHP
既简单又安全的PHP验证码 附调用方法
2016/06/02 PHP
js function定义函数使用心得
2010/04/15 Javascript
javascript nextSibling 与 getNextElement(node) 使用介绍
2011/10/13 Javascript
javascript full screen 全屏显示页面元素的方法
2013/09/27 Javascript
javascript随机将第一个dom中的图片添加到第二个div中示例
2013/10/08 Javascript
JQuery与Ajax调用新浪API获取短网址的代码
2014/02/07 Javascript
Jquery实现兼容各大浏览器的Enter回车切换输入焦点的方法
2014/09/01 Javascript
使用RequireJS优化JavaScript引用代码的方法
2015/07/01 Javascript
JavaScript知识点总结(六)之JavaScript判断变量数据类型
2016/05/31 Javascript
Vue.js父与子组件之间传参示例
2017/02/28 Javascript
表格展示利器 Bootstrap Table实例代码
2017/09/06 Javascript
微信小程序之分享页面如何返回首页的示例
2018/03/28 Javascript
Vue项目pdf(base64)转图片遇到的问题及解决方法
2018/10/19 Javascript
js正则匹配多个全部数据问题
2019/12/20 Javascript
vue父子模板传值问题解决方法案例分析
2020/02/26 Javascript
如何利用Pyecharts可视化微信好友
2019/07/04 Python
python字符串替换re.sub()方法解析
2019/09/18 Python
如何基于python操作json文件获取内容
2019/12/24 Python
李维斯法国官网:Levi’s法国
2019/07/13 全球购物
Engel & Bengel官网:婴儿推车、儿童房家具和婴儿设备
2019/12/28 全球购物
Under Armour安德玛意大利官网:美国高端运动科技品牌
2020/01/16 全球购物
Vinatis德国:法国领先的葡萄酒邮购公司
2020/09/07 全球购物
理货员的岗位职责
2013/11/23 职场文书
商学院大学生求职的自我评价
2014/03/12 职场文书
竞选班长的演讲稿
2014/04/24 职场文书
仓库规划计划书
2014/04/28 职场文书
第二课堂活动总结
2014/05/07 职场文书
就职演讲稿范文
2014/05/19 职场文书
公司行政管理制度范本
2015/08/05 职场文书
2016教师节问候语
2015/11/10 职场文书
python 爬取天气网卫星图片
2021/06/07 Python
Nginx 502 bad gateway错误解决的九种方案及原因
2022/08/14 Servers