如何简单的发布一个react组件npm包?

一.可以简单使用https://www.npmjs.com/package/create-component-lib这个npm进行发布

该包的具体的实现方式https://hackernoon.com/creating-a-library-of-react-components-using-create-react-app-without-ejecting-d182df690c6b

该教程中更正点

1. npm install --save-dev @babel/core @babel/cli @babel/preset-env

我只安装@babel/cli的时候npm run build 会失败

2. npm publish

二.最后,修改下 package.json 里的相关信息,比如组件的版本号,关键词,git 仓库等等,最重要的一点,把 react 和 react-dom 这两个依赖移到 peerDependencies 里去,这样不会导致依赖重复解析的问题。

三.如果要删除你发布的包

npm unpublish name@version

npm adduser 根据提示进行操作

四.用 Github Pages 托管 demo

如果你的项目是一个 UI 组件,那么最好你可以提供一个在线预览的地址,这样他人可以直观的看到运行效果,也会为你的项目加分不少。假设我们打包后静态 demo 的目录是在 dist 下面,里面包含一个 index.html 模板和一个 index.js 入口,运行 npm install --save-dev gh-pages,这是一个可以将我们的代码推到 gh-pages 分支的包。然后在 package.json 里添加以下脚本:

{
  "scripts": {
    "deploy": "gh-pages -d dist"
  }
}

运行 npm run deploy 就可以把 demo 发布到 Github Pages 上去了。(比如:https://luguiqing.github.io/blog/)

注意:Github Pages不支持post请求;GitHub页面只能提供静态内容