npm制做插件、发布及更新

## 1⃣️制做插件
1. 安装node及npm,以后新建一个文件夹,在终端中打开,执行命令npm init,一路回车而后输入yes便可,生成一个package.json, ` {
"name": "swTest",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"author": "",
"license": "ISC"
}`,其中name就是插件的名称,默认是文件夹名字;version为版本号,注意每次发布新版本的时候须要手动更新版本号;description是描述;main是入口文件,加载这个插件时读的文件,这个也是最重要的属性,这个属性是别人引用你的插件时,读取的入口文件,在这个文件里,须要你向外暴露接口;author是做者,能够是npm注册的名字。node

2. 在根目录下新建src文件夹,里面存放的就是本身的代码片断。
3. 在根目录下新建个 .npmignore(注意要有个.),里面就是npm在发布时会忽略项目中的文件。
4. 在根目录下新建README.md,里面时发布到npm时项目介绍。react

## 2⃣️babel转义
由于不少语法都是ES6及以上,因此须要转义成ES5。
1. 全局安装Babel: `npm install -g babel-cli`
2. ES6转码规则: `npm install babel-preset-es2015 --save-dev`
3. react转码规则: `npm install babel-preset-react --save-dev`
4. ES7不一样阶段语法提案的转码规则: `npm install babel-preset-stage-0 --save-dev` (0 - 3均可以)
5. 根目录下新建.babelrc(一样有.);加入规则 `{
"presets": [
"es2015",
"react",
"stage-2"
],
"plugins": []
}`
6. 通常咱们是将代码写在src里面,而后将整个src转义成es5,根目录下运行代码 `babel src --out-dir lib` ,获得lib文件夹,就是src转义以后的文件了。
7. 修改package.json,里面main修改成`lib/index`
8. 修改.npmignore文件,增长`src/
node_modules/
package-lock.json`git

## 3⃣️发布插件
1. 没有npm帐号的先去npm官网注册,官方网站是:`https://www.npmjs.com/`;
2. 先修改package.json中的name,修改为你的插件名,而后在npm官网查询是否已经被注册了这个名字,有的话修改一下;
3. 项目根目录下执行`npm adduser `,输入npm的帐号密码还有邮箱,缺一不可;
4. 能够运行`npm whoami`查看当前用户是不是本身;
5. 运行代码`npm publish`进行发布;
6. 能够在npm官网右上角点击packages查看本身发布的,有的话发布就成功啦;
7. 在项目之中能够引进本身的插件`npm install xxx --save-dev`进行使用啦;github

## 4⃣️维护插件
1. 对插件代码功能进行了拓展或者修改,须要从新发布新版本,除了改代码以外,须要每次手动把package.json中的version进行修改,这是版本号,表明版本改动了。npm使用的版本号规则是semver语义化版本,初始化是1.0.0,依次是主版号.次版号.修订号,主版号是不相容的API修改,次版号是功能性新增,修订号是问题修正。
2. 修改了以后再运行一次`npm publish`进行发布;
3. 发布以后在运用的项目如何更新呢?(1)若是是npm,因为是本身的插件,能够知道本身的版本修改为了什么,在项目中package.json里面找到依赖包版本,手动改为最新的版本号,而后项目运行`npm install --force`就能够了;(2)若是是yarn,运行`yarn upgrade`也ok;(3)因为项目中的依赖包会发生更新,因此有时候咱们会安装第三方插件进行查看,`npm install -g npm-check-updates`,运行`ncu` 查看可更新包,`ncu -u`更新package.json,`npm install`升级到最新版本便可。npm

代码已经传上github,`https://github.com/Songwei1029/create-plug`,有问题欢迎留言。json

相关文章
相关标签/搜索