详解如何构建一个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 迁移目录
Dec 18 Javascript
Jquery中dialog属性小记
Sep 03 Javascript
JavaScript基本语法讲解
Jun 03 Javascript
js实现跨域的方法实例详解
Jun 24 Javascript
学习使用grunt来打包JavaScript和CSS程序的教程
Jan 04 Javascript
Node.js实现数据推送
Apr 14 Javascript
微信小程序 SocketIO 实例讲解
Oct 13 Javascript
jQuery通过ajax方法获取json数据不执行success的原因及解决方法
Oct 15 Javascript
js实现可输入可选择的select下拉框
Dec 21 Javascript
JavaScript数组、json对象、eval()函数用法实例分析
Feb 21 Javascript
JS函数本身的作用域实例分析
Mar 16 Javascript
vue-simple-uploader上传成功之后的response获取代码
Sep 07 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实现批量查询清除一句话后门的代码
2008/01/20 PHP
pdo中使用参数化查询sql
2011/08/11 PHP
PHP代码实现表单数据验证类
2015/07/28 PHP
php简单复制文件的方法
2016/05/09 PHP
Ajax提交表单时验证码自动验证 php后端验证码检测
2016/07/20 PHP
thinkPHP数据库增删改查操作方法实例详解
2016/12/06 PHP
php中通用的excel导出方法实例
2017/12/30 PHP
js表数据排序 sort table data
2009/02/18 Javascript
JS等比例缩小图片尺寸的实例
2013/02/27 Javascript
js过滤特殊字符输入适合输入、粘贴、拖拽多种情况
2014/03/22 Javascript
JQuery+CSS实现图片上放置按钮的方法
2015/05/29 Javascript
深入分析jsonp协议原理
2015/09/26 Javascript
使用Angular.js实现简单的购物车功能
2016/11/21 Javascript
bootstrap Table插件使用demo
2017/08/07 Javascript
JS基于递归实现网页版计算器的方法分析
2017/12/20 Javascript
微信小程序实现城市列表选择
2018/06/05 Javascript
微信小程序基于picker实现级联菜单
2019/02/15 Javascript
使用Python脚本来获取Cisco设备信息的示例
2015/05/04 Python
python检查URL是否正常访问的小技巧
2017/02/25 Python
Django实现自定义404,500页面教程
2017/03/26 Python
Python中协程用法代码详解
2018/02/10 Python
详解Python 函数如何重载?
2019/04/23 Python
Django实现后台上传并显示图片功能
2020/05/29 Python
Java Unsafe类实现原理及测试代码
2020/09/15 Python
详解anaconda安装步骤
2020/11/23 Python
python使用scapy模块实现ARP扫描的过程
2021/01/21 Python
ECCO爱步官方旗舰店:丹麦鞋履品牌
2018/01/02 全球购物
普通大学毕业生自荐信
2013/11/04 职场文书
新学期家长寄语
2014/01/19 职场文书
安全教育实施方案
2014/03/02 职场文书
用python删除文件夹中的重复图片(图片去重)
2021/05/12 Python
Python手拉手教你爬取贝壳房源数据的实战教程
2021/05/21 Python
Java设计模式之享元模式示例详解
2022/03/03 Java/Android
九大龙王魂骨,山龙王留下躯干骨,榜首死的最憋屈(被捏碎)
2022/03/18 国漫
Golang MatrixOne使用介绍和汇编语法
2022/04/19 Golang
instantclient客户端 连接oracle数据库
2022/04/26 Oracle