Code Monkey home page Code Monkey logo

umi-react-native's Introduction

umi-react-native

Codacy Badge NPM Downloads PRs Welcome Android E2E Tests

使用 [email protected] 加速 react-native 开发效率:

NPM 包 当前版本 简介
umi-plugin-antd-react-native npm version @ant-design/react-native提供按需加载主题定制、预设、切换,国际化支持,在expo链接字体图标
umi-preset-react-native npm version 基础包,让umi具备开发 RN 的能力。需要 react-native 0.44.0 及以上版本(>=0.44.0)
umi-preset-react-navigation npm version 使用react-navigation替换react-router开发地道的原生应用。需要 react-native 0.60.0 及以上版本(>=0.60.0)
umi-renderer-react-navigation npm version 支持以react-navigation的方式来渲染react-router所定义的路由模型。无须单独安装该依赖
umi-react-native-multibundle npm version RN Bridge API,为 JS 层提供按需加载 Bundle 文件的能力。需要 react-native 0.62.2 及以上版本(>=0.62.2)

快速开始

umi 在 RN 中仅用来生成中间代码(临时文件),介于编码构建的之间,旨在引入 umi 的开发姿势来提升 RN 编程体验。

下游可以使用:

  • React Native CLI:RN 官方开发/打包工具;
  • expo:不需要搭建 iOS 和 Android 开发环境,工程目录干净清爽,添加 RN 依赖方便快捷;
  • haul:第三方 RN 打包器,使用 webpack。缺点是不支持:Fast Refresh、Live Reloading、Hot Replacement。

umi-preset-react-native会探测用户工程内的依赖,自动为这些工具生成所需的配置文件入口文件

通常你只需要选择其中一款,如果全都要请查看:umi-preset-react-native 扩展配置

使用 React Native CLI

示例工程:UMIRNExample

使用 expo

示例工程:UMIExpoExample

使用 haul 拆包

当 RN 工程满足下列条件才会拆包:

示例工程:UMIHaulExample

文档

案例

测试

端到端测试

测试用例:example/e2e/app.spec.js

umi-react-native's People

Contributors

codacy-badger avatar xuyuanxiang avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar

umi-react-native's Issues

drawer-navigation

Do you have any example with DrawerNavigation from react-navigation?

关于本工程的导航路由设计**

本工程中,在/pages/index.js中使用的是BottomTabNavigator
这种方式在我理解看来是App一次性加载完所有的Screen屏幕内容。
如果:
1.单个Screen的内容消耗的性能很大(比如3D),这对性能要求就很高。
2.当想从 商品Screen 收藏(Like)一些内容,在 收藏Screen 中展示,这种情况似乎用 ”双页面“ 更好。

我的疑问是:

  1. 为什么这样子设计?
  2. 如果这样设计不合理,用什么方式改良?

谢谢~

arrow property in Link

Can you show from where this Link is pulled from? Umi document doesnt' say it has arrow property in the Link.


<Link to="/home" component={Item} arrow="horizontal">

一个额外的话题 — — 由渲染3D到有感而发

我查遍了国内外关于在RN中使用Three.js(或者其他3D库)的方法,都没有一个很好的解决方案。
国外有一个 react-three-fiber 库,但似乎依赖于Expo服务工具去开发。
写在这里的原因:

  • 一个是想解决实际的问题;

  • 其次是想展望RN的未来(或者说facebook技术生态的未来。两年前的React360似乎也已经停止了运作。)

  • 经过两三年的狂热,现在的前端生态依然还是那么地曲折。。。

redux to navigate

Instead of directly modifying the history, I think if we use redux would be proper. I'm also digging it if something through redux we can keep sync with history. Let me know your thoughts as well.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.