React Native 组件封装上传简单教程

组件化.jpg

npm是一个node包管理和分发工具,已经成为了非官方的发布node模块(包)的标准。通过npm可以很快的找到特定服务要使用的包,进行下载、安装以及管理已经安装的包。
本文将就如何发布npm包进行一个详细的介绍以及将之前封装的react-native-zkbanner作为例子进行发布。

注册npm账户:

进行发布的操作之前,我们需要首先在npm官网上注册自己的账号,用于后面发布时使用。
注册地址:https://www.npmjs.com/

添加账号信息:

这里我们发布到npm官网所在的仓库,执行以下命令添加用户信息:

npm adduser --registry http://registry.npmjs.org

执行命令之后,会提示填写用户名,密码以及邮箱,填写之前在官网注册的信息就可以了。

发布npm插件:

1、在命令行工具中,切换当前路径到要发布的插件的路径下,发布必须有package.json文件,这是使用npm init命令生成的,根据自己插件的具体信息再进行输入。下面代码是react-native-zkbanner组件的package.json文件。

{
  "name": "react-native-zkbanner",
  "version": "1.0.0",
  "description": "zkbanner",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "keywords": [
    "react-native",
    "banner",
    "react-native-zkbanner"
  ],
  "author": "Cain",
  "license": "MIT"
}

name:

name和version是package.json中最重要的两个字段,也是发布到NPM平台上的唯一标识,如果没有正确设置这两个字段,包就不能发布和被下载。
以下是官方给出的一些建议:
名字里不要再包含"js"和"node",因为默认NPM包就是node.js程序,不过你可以通过engines字段来指定。
名字将会被作为url的一部分,所有要符合http url的一般命名规则,不能包含url非法字符,也不能以.和_开头。
名字也将作为require()命令的参数,所以应该尽量简明。
如果包要发布到NPM平台上的话,最好先检查下有没有重名, 并且字母只能全部小写。
新版本的NPM可以指定scope, 名字可以加前缀标识,如@ijse/mypackage。

version

发布的版本

description

包的描述信息,将会在npm search的返回结果中显示,以帮助用户选择合适的包。

keywords

包的关键词信息,是一个字符串数组,同上也将显示在npm search的结果中。

main

包的入口文件,如index.js

以上是package.json的部分字段的介绍,详细可以参考package.json for NPM 文件详解

2、将插件发布到npm上:

npm publish --registry http://registry.npmjs.org

这里加上--registry http://registry.npmjs.org 是为了区别于我们当前的npm私服,如果不加上的话,发布就是默认发布到npm所设置的源。

查看发布情况:

命令执行完成后,打开npm链接:https://www.npmjs.com/ + 插件名, 就可以看到已经成功发布了,这里我的插件地址是:https://www.npmjs.com/react-native-zkbanner

新轮子:

react-native-zkbanner

Demo

安装方法:

npm install react-native-zkbanner
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 159,219评论 4 362
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 67,363评论 1 293
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 108,933评论 0 243
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 44,020评论 0 206
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 52,400评论 3 287
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 40,640评论 1 219
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 31,896评论 2 313
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 30,597评论 0 199
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 34,327评论 1 244
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 30,581评论 2 246
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 32,072评论 1 261
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 28,399评论 2 253
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 33,054评论 3 236
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 26,083评论 0 8
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 26,849评论 0 195
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 35,672评论 2 274
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 35,585评论 2 270

推荐阅读更多精彩内容