资讯专栏INFORMATION COLUMN

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

qieangel2013 / 3302人阅读

摘要:前言过程初始化目录组件名称将会生成文件新建目录作为组件的源代码目录,作为组件入口新建目录作为组件的编译后目录,这个目录只读修改的字段为或编写组件中就可以编写组件了,导出组件调试组件执行在根目录下,组件名称通过命令,可以在本地模拟项目组件

前言 过程 初始化目录
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 (
            
Hello,World!
) } }
调试组件
执行 npm link
在根目录下,create-react-app example
cd example && npm link "组件名称"

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

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

import 组件名称  from “组件名称”
发布
注册npm账号
登陆npm账号
npm publish
小结

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/106760.html

相关文章

  • React Native植入原生Android应用的流程解析

    摘要:在应用内添加依赖回到,到的文件级别的里添加依赖最后一行的就是我们新增的,注意这里的版本号要和里的一致。因此,建议用这样的写法,并检查版本号是否和里的一致。 引言 React Native是现在移动开发新的可选方案,也带来了原属于Web领域的React的优秀开发特性。另一方面,React Native的技术栈一经掌握,可以用于iOS、Android及Windows(见此)多个平台,即所说...

    worldligang 评论0 收藏0
  • 翻译 | 从 ReactJS React-Native—两者的主要差异是什么?

    摘要:跟非常相似,但是在开始尝试你第一个之前,也需要了解两者之间的一些差异。推荐的方式是使用提供的。能用到组件中的或者上以启用这个组件的触摸事件。 华翔,Web前端开发工程师著作权归作者所有,转载请联系作者获得授权。 showImg(https://segmentfault.com/img/bVUliz?w=640&h=235); React-Native已经诞生有两年左右了,自从适配了An...

    darkerXi 评论0 收藏0
  • 电影天堂React Native 客户端V2.0发布

    摘要:电影天堂客户端重新开始具体更新以为准。重新开始两年前发布了第一个版本。最为一名偏体验偏设计的前端开发者,对界面和用户体验都有极高的重视。 电影天堂React Native 客户端 重新开始! 具体更新以https://github.com/XboxYan/DYTT为准。 重新开始 两年前发布了第一个版本。 现在, 使用最新的react-native 0.57和全新的设计完成了V2.0 ...

    MockingBird 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<