第一次发布自己的npm包

背景

在做表单的时候,会遇到很多的表单项的验证工作,几乎很多验证都是重复的,有一个比较好的lodash库来做了这些工作,但是里面有些方法和实际的业务工作有些不符。比如,lodash.isEmpty(2) // true是会认为是空的。这显然与实际的业务是不符的。另外还有一些数字校验等其他的常用的校验方法,想结合lodash做一个自己的库,这样比较有利于业务的开发。

基于以上的考量,准备开一个自己的jsUtils库。

实践

1. 新建个npm账号

npmjs上注册一个自己的账号。

2. npm init

新建一个项目,cd进去,然后执行npm init来初始化项目的配置。

配置项:

  • name:填写你这个包的名字,默认是你这个文件夹的名字。不过这里要着重说一下,最好先去npm上找一下有没有同名的包。最好的测试方式就是,在命令行里面输入npm install 你要取的名字,如果报错,那么很好,npm上没有跟你同名的包,你可以放心大胆地把包发布出去。如果成功下载下来了。。。那么很不幸,改名字吧。。。
  • version:你这个包的版本,默认是1.0.0
  • description:其实我也不知道是什么,按回车就好了。。。,这个用一句话描述你的包是干嘛用的,比如我就直接:‘a plugin for * express.register routes base on file path’
  • entry point:入口文件,默认是Index.js,你也可以自己填写你自己的文件名
  • test command:测试命令,这个直接回车就好了,因为目前还不需要这个。
  • git repository:这个是git仓库地址,如果你的包是先放到github上或者其他git仓库里,这时候你的文件夹里面会存在一个隐藏的.git目录,* * npm会读到这个目录作为这一项的默认值。如果没有的话,直接回车继续。
  • keyword:这个是一个重点,这个关系到有多少人会搜到你的npm包。尽量使用贴切的关键字作为这个包的索引。我这个包嘛,第一是在* express下工作的,然后又是一个插件plugin,然后又是一个注册路由route用的,而这个路由又是基于文件目录dir,所以很好就得出我的包的索引关键字。
  • author:写你的账号或者你的github账号吧
  • license:这个直接回车,开源文件来着。。。 然后它就会问你Are you ok?

回车Ok! 然后我们回到我们的文件目录里面去看一看,发现多出来一个package.json文件,点进去基本上就是下面这张图输出的信息。

{
  "name": "jsutils-100",
  "version": "1.0.1-alpha.2",
  "author": "spring.hehe.v5",
  "dependencies": {
    "lodash": "^4.17.10"
  },
  "scripts": {
    "test": "jest"
  },
  "devDependencies": {
    "jest": "^23.5.0"
  },
  "description": "在 lodash 基础上扩展的一些 jsUtils",
  "main": "index.js",
  "repository": {
    "type": "git",
    "url": "git+https://github.com/springHyc/jsUtils.git"
  },
  "keywords": [
    "jsUtils"
  ],
  "license": "ISC",
  "bugs": {
    "url": "https://github.com/springHyc/jsUtils/issues"
  },
  "homepage": "https://github.com/springHyc/jsUtils#readme"
}

3. 写项目

首先入口文件是index.js,或者是你刚才修改了那个entry point的值,那么你这个文件名也跟着改为那个值。

image.png

因为我把封装好的代码都扔在lib里面,所以,index.js里面也就一句话:

module.exports = require("./src");

而大多数的包里面写的是module.exports=require('./lib')。这个需要找下原因。

然后写个readme.md文件就可以执行npm publish命令啦。

遇到的问题

由于我采用的es6的语法,直接发布没问题,但是应用到项目中,项目打包发布时就会出现语法错误。

image.png

出错的地方就就是es6的...目前不能用到对象中。like this:

image.png

所以需要引入babel来将es6转化一下,一开始只用的babel-preset-es2015这个的转化还是不行,仍然是报错,最终使用的转化强度更大的babel-preset-stage-0来能够彻底转化。

like:

image.png

遗留问题

  1. 发布时,是发布的lib下的转化文件,那么需要添加一个package.json文件才能发布的,每次手动添加总是麻烦,准备写一个命令才搞定。期待中... 也是自己向【大前端】迈进的第一步,come on !!!
  2. 为什么项目中需要使用
const lodash = require("lodash");
const jsUtils = {};
module.exports = jsUtils;

这样的方式来组织文件呢?为什么用import lodash from "lodash"在执行npm test时会报错呢?

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏Ryan Miao

Git 工作流的正确打开方式

前言 一直在使用git做版本控制,也一直工作很顺利,直到和别人发生冲突的时候。这才注意到git 工作流并不是那么简单。比如,之前遇到的清理历史。百度到的资料很...

33760
来自专栏铭毅天下

刨根问底 | Elasticsearch 5.X集群多节点角色配置深入详解

1、问题引出 ES5.X节点类型多了ingest节点类型。 针对3个节点、5个节点或更多节点的集群,如何配置节点角色才能使得系统性能最优呢? ? 2、...

48780
来自专栏Crossin的编程教室

【Python 第64课】python shell

各位好久不见,我终于又更新了:D。今天抽空来讲点非常非常基础的东西,关于在哪里写 python。 如果你已经编写过自己的程序,相信对这些内容已经熟悉。但很多刚刚...

358100
来自专栏桥路_大数据

ElasticSearch配置外网访问,开放9200端口

56450
来自专栏专注 Java 基础分享

弄懂 JRE、JDK、JVM 之间的区别与联系

其实很多 Java 程序员在写了很多代码后,你问他 jre 和 jdk 之间有什么关系,jvm 又是什么东西,很多人不知所云。本篇不会讲述 jvm 底层是如何与...

38140
来自专栏Python数据科学

Python爬虫之模拟登录wechat

不知何时,微信已经成为我们不可缺少的一部分了,我们的社交圈、关注的新闻或是公众号、还有个人信息或是隐私都被绑定在了一起。既然它这么重要,如果我们可以利用爬虫模拟...

3.3K20
来自专栏漫漫深度学习路

tensorflow学习笔记(四十一):control dependencies

tf.control_dependencies()设计是用来控制计算流图的,给图中的某些计算指定顺序。比如:我们想要获取参数更新后的值,那么我们可以这么组织我们...

61190
来自专栏腾讯云API

腾讯云 API 最佳实践: 善用幂等性

有些开发者问我云服务器“创建实例”接口有一个参数“ClientToken”不知道有什么作用。本文作一个简单的解答。

4.6K150
来自专栏IT大咖说

饿了么资深Android工程师带你领略Kotlin协程的力量

内容来源:2018 年 6 月 28 日,饿了么资深Android工程师张涛在“droidcon上海2018安卓技术大会”进行《领略kotlin协程的力量》演讲...

67040
来自专栏Java帮帮-微信公众号-技术文章全总结

Web-第二十天 Redis学习【悟空教程】

rpm -e --nodeps java-1.6.0-openjdk-1.6.0.0-1.66.1.13.0.el6.i686

19650

扫码关注云+社区

领取腾讯云代金券