(动手)发布一个react/react-native组件到npm社区

前言

过程

初始化目录

mkdir ‘组件名称’

npm init

将会生成package.json文件

新建src目录作为组件的源代码目录，index.js作为组件入口
新建lib目录作为组件的编译后目录，这个目录只读

修改package.json的main字段为"src/index.js"或"lib/index.js"

编写组件

src/index.js中就可以编写组件了，导出组件

export default class extends React.Component{
    render(){
        return (
            <div>Hello,World!</div>
        )
    }
}

调试组件

执行 npm link

在根目录下，create-react-app example

cd example && npm link '组件名称'

通过npm link命令，可以在本地模拟项目 npm install '组件名称'

接下来，你就可以在example项目中，

import 组件名称  from “组件名称”

发布

注册npm账号

登陆npm账号

npm publish

小结