对React Native的简单了解+环境配置的注意事项

-------对React Native的简单了解+环境配置的注意事项-------

开发者可以灵活的使用HTML和CSS布局,使用React语法构建组件,实现:H5, Android, iOS 多端代码的复用。------面向组件开发(就是RN里面的任何一个类都可以通过注册产生一个组件)


对React Native的简单了解+环境配置的注意事项_第1张图片

React Native提倡组件化开发: 即提供一个个封装好的组件,组件相互嵌套形成新的组件;

  • 跨平台开发
    • 运用React Native,我们可以使用同一份业务逻辑核心代码来创建- - 原生应用运行在Web端,Android端和iOS端;
  • 3.2 追求极致的用户体验:实时热部署
  • 3.3 learn once,write everywhere (最具魅力)


    对React Native的简单了解+环境配置的注意事项_第2张图片
    image1.png

环境配置的一些说明:

  • Homebrew

    • Homebrew, Mac系统的包管理器,用于安装NodeJS和一些其他必需的工具软件。
  • Node(React Native目前需要NodeJS 5.0或更高版本)
    使用Homebrew来安装Node.js.

  • Yarn、React Native的命令行工具(react-native-cli)

    • Yarn是Facebook提供的替代npm的工具,可以加速node(放有所有的node.js资料)模块的下载。React Native的命令行工具用于执行创建、初始化、更新项目、运行打包服务(packager)等任务。

选择性安装的工具(可以不安装):

  • Watchman

    • Watchman是由Facebook提供的监视文件系统变更的工具。安装此工具可以提高开发时的性能(packager可以快速捕捉文件的变化从而实现实时刷新)。
  • Flow

    • Flow是一个静态的JS类型检查工具。译注:你在很多示例中看到的奇奇怪怪的冒号问号,以及方法参数中像类型一样的写法,都是属于这个flow工具的语法。这一语法并不属于ES标准,只是Facebook自家的代码规范
      ![Uploading image3_506273.png . . .]
      。所以新手可以直接跳过(即不需要安装这一工具,也不建议去费力学习flow相关语法)。

-----如何创建一个React Native项目:----

  • 安装好环境以后:
  1. 创建项目:
    cd到要存在此项目的目录,然后运行:
    react-native init AwesomeProject(项目名字)


    对React Native的简单了解+环境配置的注意事项_第3张图片
  2. 运行项目:
    • 2.1 直接用xcode打开项目,点击运行;(运行时,首先会调用RN的本地服务器,也就是说他把它所有的内容都大包放到了本地服务器里面)


  3. 分析工程目录:


    对React Native的简单了解+环境配置的注意事项_第4张图片
    • 存放一些配置信息:


    • 开发中我们主要是操作着两个文件:


    • 打开index.ios.js是编译器回报一堆警告:那时因为我们RN是用js的另外一种语法,JSX,切换一下就好!


---------------如何进行版本的管理(RN更新版本更新快)------------

对React Native的简单了解+环境配置的注意事项_第5张图片

------------在WebStrom中设置RN的代码提示-----------

对React Native的简单了解+环境配置的注意事项_第6张图片

可以查看此链接帮助设置:
http://blog.csdn.net/yayayaya20122012/article/details/51119801

你可能感兴趣的:(对React Native的简单了解+环境配置的注意事项)