博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
npm-发布&管理module
阅读量:7113 次
发布时间:2019-06-28

本文共 1988 字,大约阅读时间需要 6 分钟。

前言

原文:

公司大了,团队大了以后,自然会出各种产品,即各种项目。而我们知道,每个项目其实都有很多共同的代码可以复用。复制粘贴这种重复劳动当然每个人都很讨厌,而且还有操作失误的情况。因此,往往,比如常用函数封装、正则、组件等,都可以做成npm module发布到npm上,方便所有的项目使用。

基础

基础的命令和操作就不介绍了,资料太多,当然还是最推荐官方的教程,。然后,我发现掘金的一篇文章作为补充也不错,。

管理

在做自己的module之前,不得不说说怎么管理module这个项目。npm本身并没有版本管理的能力,我们publish什么,npm上就是什么。因此,很显然,我们需要Git来管理我们的npm module。

团队合作的时候,如果是多人维护一个npm module,npm publish的权限建议只能是一个人,比如是创建这个module的人,我们暂且叫他Tom。其他人,包括Tom,对module的所有修改,先push到Git上,然后由Tom做code review。当Tom觉得OK、没问题了以后,合并代码,然后npm publish到npm。
总结一下,我们通过这两点来管理:

  1. git
  2. 单人npm publish

实现

接下来,我们从0开始,一步步地实现属于我们的npm module,过程中,我们会遇到webpack的配置,读者可以不用太理解webpack部分,应该更多关注npm方面,不过如果对webpack配置有兴趣或者疑问,可以评论留言哦。OK,让我们开始吧~

一、创建git项目

这里我们选用github,首先创建项目:

github
然后本地clone代码。

.├── README.md└── package.json

二、初始化npm

npm init

依次输入package name,version,description,git repository等。

有两个需要注意:

  1. package name如果是公共module,取一个独一无二的名字就好了,如果我们想创建一个私有的module(基本每个稍微大点的公司团队都有private的npm module),那就得以@开头,然后跟上公司名或者团队名,再用/分割,最后接模块名字,比如@xkeshi/utils,然后只有加入这个私有项目的成员才有权限npm安装@xkeshi/utils这个包。其实关于public和private,即共有和私有的区别,文章开头的“基础”部分推荐的教程里也讲的很清楚了。
  2. git repository填github项目地址(默认就是)。

我们继续,按照npm一路的提示填好资料后,我们会有一份package.json生成,里面就是我们刚才填写的信息。

三、创建入口文件

npm init的时候,在填entry point的时候,我们如果选择默认的话就是index.js。那就在根目录创建一个index.js吧。

四、写两个功能

首先创建一个文件夹加src,然后里面创建两个文件夹,第一个就叫mathematic,里面封装一些数学函数;第二个叫regex,里面就是一些常用的正则。目录结构为:

├── README.md├── index.js├── package.json└── src    ├── mathematic    │   ├── README.md    │   └── index.js    └── regex        ├── README.md        └── index.js

具体的math和regex代码我就不介绍了,文章最后会附上项目地址,读者可以自己查看。

五、创建examples

我们怎么知道自己写的东西是不是有问题呢?或者,怎么才能让使用者知道他正准备用的东西能不能达到他的预期呢?所以,examples不可少。具体的代码就忽略了,可以看文章最后的项目地址。

六、Webpack

问题又来了,其实,我们编写的util都是用es6甚至es7的语法,游览器并不能执行。所以我们不得不用babel编译,又因为js模块化的需要,因此,webapck自然加了进来。

webpack和babel的配置就不多说了。

七、加.npmignore

我们的npm包有webpack配置文件,有examples,有node_modules,这些其实我们并不想要,因此,我们可以通过.npmignore来在npm publish的时候,忽略自己不想要的文件。

八、提交代码到github

代码都写好,运行测试没问题以后,push到GitHub。

九、发布自己的npm

在这之前,你得去npm注册过,然后npm login,最后发布npm publish就哦了。

项目地址

文章中项目github地址戳这里:

文章中项目npm地址戳这里:

转载地址:http://wjwel.baihongyu.com/

你可能感兴趣的文章
adstrtal.sh报超时错误 ERROR : Timed out( 100000 ): Interrupted Exception
查看>>
一个前端工程师的基本修养
查看>>
一个android版本的rss阅读器--明天补充实现过程,先上图
查看>>
JavaScript:文本域事件处理
查看>>
一步一步教你使用AgileEAS.NET基础类库进行应用开发-基础篇-演示ORM中的查询
查看>>
《C#高级编程》笔记系列--点滴记录(持续更新中……)
查看>>
采用泳道图工具跟踪项目进度或者问题解决进度
查看>>
sql server 2008学习1–系统数据库
查看>>
从微软的DBML文件中我们能学到什么(它告诉了我们什么是微软的重中之重)~三 分部类是否破坏了单一职责...
查看>>
HDU1004 Let the Balloon Rise
查看>>
value toDF is not a member of org.apache.spark.rdd.RDD
查看>>
jRating评分插件使用
查看>>
高性能MySQL——Count(1) OR Count(*)?
查看>>
Spark源码分析之Worker
查看>>
JVM系列三:JVM参数设置、分析
查看>>
CAS与spring3集成
查看>>
LAMP一体环境快速安装
查看>>
p12文件中导出公钥和私钥
查看>>
数据转储概念
查看>>
Java基础学习总结(20)——基础语法
查看>>