本文参考自https://blog.csdn.net/ericsxd/article/details/103288478

 

VSCode的配置可参考https://blog.csdn.net/chali1314/article/details/109642208

1、yarn以及 React Native命令行工具

npm install -g yarn react-native-cli

2、创建一个工程目录(workspace),如下:
E:\react-native\project_test

3.Windows系统输出cmd打开终端,定位到刚才的workspace(E:\react-native\project_test),

4.接下来使用React Native命令行工具来创建一个名为 testDemo 的工程,输入命令:react-native init testDemo --version 0.57.0
(版本定为0.57.0)

执行以上命令之前需要设置yarn员,否则可能无法正常初始化项目

npm查看原来的镜像

npm get registry

npm设置淘宝镜像

npm config set registry http://registry.npm.taobao.org/

npm设置成原来的镜像

npm config set registry https://registry.npmjs.org/

yarn查看原来的镜像

yarn config get registry

yarn设置成淘宝镜像

yarn config set registry http://registry.npm.taobao.org/

yarn设置成原来的镜像

yarn config set registry http://registry.npmjs.org/

至此,rn 工程创建成功!

VSCode需要安装插件React-native Tools, Android(查看logcat,安装之后,点击查看-命令面板,输入Android:View Logcat就会打开logcat窗口)

5. 运行RN工程
继上节内容我们现在cmd终端定位到当前工程跟目录:

运行命令:
react-native start,显示Loading,出现done之后输入 react-native run-android,如果出现build successful则说明编译成功

react-native查看android日志:
npx react-native log-android(adb logcat *:S ReactNative:V ReactNativeJS:V)
react-native查看ios日志:
npx react-native log-ios

备注:如果导入工程,执行react-native run-android时出现错误,先把导入的node_modules删除,然后执行yarn install重新下载依赖,再执行react-native run-android

 

Logo

开源鸿蒙跨平台开发社区汇聚开发者与厂商,共建“一次开发,多端部署”的开源生态,致力于降低跨端开发门槛,推动万物智联创新。

更多推荐