(动手)发布一个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

小结

    原文作者:winward
    原文地址: https://segmentfault.com/a/1190000020074184
    本文转自网络文章,转载此文章仅为分享知识,如有侵权,请联系博主进行删除。
点赞