React-Native 学习之路 - 安装运行

中文官网:https://reactnative.cn/

版本:0.55

系统:Windows

安装:参考官网

编辑器:WebStorm(破解方法:http://idea.lanyus.com/)

    安装OK之后,使用命令行工具CD 到 自己的项目目录(如D:/ReactNative,可以和安装目录分开),输入命令:react-native init 项目名 --version 0.55.3 (不加版本号--version 0.55.3会下载最新版本)

安装之后目录:


React-Native 学习之路 - 安装运行_第1张图片
目录

入口文件:index.js

查看组件及配置文件:package.json

运行项目:CD到自己创建的项目下 react-native run-android

期间有很多坑(填坑传送门):

    https://www.jianshu.com/p/28534cc5b757

    https://www.jianshu.com/p/e447b29c0684

当项目成功运行,运行的文件是App.js,可以修改为:


React-Native 学习之路 - 安装运行_第2张图片
Hello World

WebStorm 运行React-Native:

用WebStorm 打开项目,点击右侧Edit Configurations...


React-Native 学习之路 - 安装运行_第3张图片
Edit Configurations...

弹窗之后选择左上角+号,选择React Native


React-Native 学习之路 - 安装运行_第4张图片
React Native 添加

Name 随自己填写,确认好配置后,点击Apply、OK


React-Native 学习之路 - 安装运行_第5张图片
保存配置

保存之后,点击右侧Edit Configurations... 选择保存的配置,再点击三角形或者爬虫按钮即可运行(命令行工具先运行一次,之后可以一直用WebStorm运行)


React-Native 学习之路 - 安装运行_第6张图片
选择配置

你可能感兴趣的:(React-Native 学习之路 - 安装运行)