搭建 React Native 开发环境中遇到的问题记录

Author Avatar
dev.liang 7月 02, 2019
  • 在其它设备中阅读本文章

最近因为工作需要在学习 React Native,过程中遇到的一些问题,简单整理一下,方便以后查阅~ ,主要参考的是 React Native 中文官网的一些指南,遇到问题再针对性的解决。比如安装过程中会提示你 NVM 环境变量没配置啦,你需要按照 log 提示进行配置等诸如此类问题~

nvm,node,npm,nrm 之间的区别

nvm:nodejs 版本管理工具
nodejs:在项目开发时的所需要的代码库(node -v)
npm:nodejs 包管理工具
nrm: (npm registry manager )是npm的镜像源管理工具,有时候国外资源太慢,那么我们可以用这个来切换镜像源

You need to run “nvm install N/A” to install it before using it

打开终端后一直提示这个,很烦,解决方法:
查看 node 版本 node -v

执行命令: nvm ls 查看 “default” Node 版本,如果是 default -> node (-> N/A) 类似这样的代码,这是引起报错的原因。
执行命令:nvm alias default node
执行命令:nvm ls 查看展示
中间可能会出现一些不能设置默认版本的,那可以再下载一个别的版本,然后再次切换。

在创建 android demo 时候,打开 app 界面很多红色背景的 log 信息

可能是因为服务没有启动
执行

1
react-native start

如果提示什么端口被占用,还需要把占用的端口关掉

1
2
3
4
5
6
异常如:
Metro Bundler can't listen on port 8081

执行:
sudo lsof -i :8081 列出占用的列表
kill 查到的 对应的 pid 号

nvm 的有关命令

1
2
3
4
5
6
7
8
9
10
11
nvm install stable ## 安装最新稳定版 node
nvm install <version> ## 安装指定版本
nvm uninstall <version> ## 删除已安装的指定版本
nvm use <version> ## 切换使用指定的版本node
nvm ls ## 列出所有安装的版本
nvm ls-remote ## 列出所有远程服务器的版本
nvm current ## 显示当前的版本
nvm alias <name> <version> ## 给不同的版本号添加别名
nvm unalias <name> ## 删除已定义的别名
nvm reinstall-packages <version> ## 在当前版本 node 环境下,重新全局安装指定版本号的 npm 包
nvm alias default [node版本号] ##设置默认版本

react-native 一些命令

react-native link build node_modules 库
react-native start 开启服务
react-native run-android 编译安卓程序到手机

执行 brew install watchman 没有权限

使用如下指令获取 usr/local 文件夹的写入权限
sudo chown -R $(whoami) /usr/local/*
重新调用 brew install watchman ,即可正常完成安装。

‘whoami’ linux 命令,命令用于打印当前有效的用户名称,相当于执行 id -un 命令。