React Native初次使用遇到的问题

news2024/9/22 11:37:20

Write By Monkeyfly

以下内容均为原创，如需转载请注明出处。

前提：距离上次写博文已经过去了5年之久，诸多原因导致的，写一篇优质博文确实费时费力，中间有其他更感兴趣的事要做（打游戏、旅游、逛街、看电影、剪辑等），再加上总是感觉属于自己的时间很少，所以一有时间就去做自己想做的事了。不管怎么说，本质还是松懈和懒惰的问题。再次“提笔重写”，一是因为目前处于离职状态，时间充裕，二是最近刚开始学 React Native，想以初学者的心态记录一下刚上手遇到的一些问题。

  • 本人学习入口：
    • React Native 官方英文文档：Get Started with React Native
    • Expo 官方英文文档： Get started creating apps with Expo
  • 根据官网教程，使用官方推荐的 React Native 框架 Expo 进行初次上手体验，直接从创建一个全新的 RN 项目开始。
# 使用 Expo 启动一个新的 React Native 项目（命令行直接执行即可）
npx create-expo-app@latest
  • 问题会持续更新…

1、npx create-expo-app@latest 命令执行报错1

问题： request to xxx failed, reason: certificate has expired （镜像请求失败，证书已过期）
生词：
certificate 英[səˈtɪfɪkeɪt] n.证书
问题定位：
npx create-expo-app@latest 命令执行时的版本信息：

  • node ：16.15.0
  • npm：8.5.5
    在这里插入图片描述
    解决方法：
    在百度根据关键词 certificate has expired 检索的答案，或者用这个关键词： 关于npm安装淘宝镜像证书过期问题
#取消ssl验证（设置后，问题解决了）
npm config set strict-ssl false

2、npx create-expo-app@latest 命令执行报错2

问题：Unsupported engine，提示 node 版本过低，也是执行 npx create-expo-app@latest 命令时遇到的报错。
在这里插入图片描述
问题分析：应该安装哪个版本的 node？根据上图提示，只要版本>=18.13.0 都可以？
在这里插入图片描述

传送门：Expo 官方文档 - Learn how to create a new Expo project.

问题定位： 显而易见，首先需要 LTS 版本的 node。然后就涉及到多版本 node 的管理问题，直接百度搜索关键词：mac node 版本管理，给出的答案：可以使用 nvm（‌Node Version Manager）‌来轻松切换和安装多个Node.js版本。

解决：升级并使用 LTS 的 node 版本，然后重新运行创建工程的命令。

然后在百度搜一下 nvm 的用法（注：电脑之前已经安装了 nvm），只需要安装一下最新稳定版的 node 即可（没有的 nvm话，需要自行安装）。
做法：直接执行安装命令 nvm install --lts（安装完成后，当前使用的 node 版本会自动切换到已安装版本，无需再执行 nvm use <version> 命令进行手动切换）。

基本用法：

# 查看 nvm 版本
nvm -v
# 当不知道 nvm 命令用法时
nvm --help 
# 查看已安装的 node 版本
nvm ls
# 安装指定版本的 node
nvm install <version>
# 卸载指定版本的 node
nvm uninstall <version>
# 切换 node 版本
nvm use <version>
# 查看当前激活的 node 版本
nvm current

常用命令的说明样例：

Example:
  nvm install 8.0.0                     Install a specific version number
  nvm use 8.0                           Use the latest available 8.0.x release
  nvm run 6.10.3 app.js                 Run app.js using node 6.10.3
  nvm exec 4.8.3 node app.js            Run `node app.js` with the PATH pointing to node 4.8.3
  nvm alias default 8.1.0               Set default node version on a shell
  nvm alias default node                Always default to the latest available node version on a shell

  nvm install node                      Install the latest available version
  nvm use node                          Use the latest version
  nvm install --lts                     Install the latest LTS version
  nvm use --lts                         Use the latest LTS version

在这里插入图片描述
注：一开始用下面这个命令，就是因为不知道怎么安装最新 LTS 版本的 node，想的是分两步操作：先找到对应版本，然后再安装。

# 列出可供安装的远程版本，从列表中找到 最新的 LTS 版本（不建议）
nvm ls-remote

在这里插入图片描述

# 然后安装最新的 LTS 版本的 node
nvm install 20.16.0
# 当时其实完全可以用下面这个命令代替【强烈建议】
nvm install --lts

在这里插入图片描述
注：本来新版 node 安装完成后，不需要手动执行下面2行命令进行版本切换（因为一开始并不知道安装完以后，node 版本会自动切换）
在这里插入图片描述
至此，node 版本切换成功，安装报错的问题解决。
安装1
安装2

注意： 该问题也是后面多开命令行窗口才发现的，nvm use 命令只能用于临时切换到指定的 node 版本，‌切换只在当前窗口生效，‌关闭窗口后切换失效。‌

# 永久切换：切换后的 node 版本在所有窗口中都生效。
# 这样设置后，‌每次启动新的 shell 时都会默认使用这个版本。‌
nvm alias default <version>

3、npx expo start 命令启动本地开发服务器时报错

问题：报错信息TypeError: Invalid character in header content ["X-React-Native-Project-Root"]，百度了一下，说是路径中包含中文导致的。

首先说一下为什么会遇到这个问题？因为我在配置环境时，选择的开发方式是 Expo Go（如下图所示，但限制就是必须要下载该软件），为什么选它？根据文中的介绍，想快速试用体验一下 Expo（Expo Go 是一个非常适合快速测试 Expo 的沙盒，但不适用于长期项目，在【没有自定义原生模块】的受限沙盒中尝试应用开发）。

Expo Go 的缺点：安卓要从 Google Play Store(谷歌应用商店) 下载，iOS 需要从 App Store 下载，国内的网络环境肯定无法直接下载，要通过其他方式绕过限制进行下载，稍微麻烦一些。经过一番折腾，最终是下载下来了，用起来还挺方便。

另外一种开发方式（开发构建自己的 app）后续再尝试一下。
它的特点：

  • 使用开发者工具构建自己的 app
  • 支持自定义原生模块
  • 适用于生产项目

在这里插入图片描述

在这里插入图片描述

传送门：Expo Docs-Set up your environment

问题定位：果不其然，有个文件夹的名称是中文，xxx前端。以后还是项目尽量不要放在中文命名的子目录下。
在这里插入图片描述
解决方法：换个文件夹，重新执行一遍创建项目的过程，问题解决了。
在这里插入图片描述
Expo Go 软件使用截图：
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：http://www.coloradmin.cn/o/1964695.html

如若内容造成侵权/违法违规/事实不符，请联系多彩编程网进行投诉反馈，一经查实，立即删除！

相关文章

4.2、存储管理-页式存储

4.2、存储管理-页式存储

页式存储和段氏存储会考 页式存储几乎必考&#xff0c;段氏存储可能会考 页式存储 页式存储是操作系统的一种存储管理方式。 因为我们的程序往往是远远大于内存的&#xff0c;所以程序在执行的时候&#xff0c;是不会一次性把所有内容都装入到内存中&#xff0c;它会把程序分…
阅读更多...
实验3-3 比较大小 想知道①和②的区别是什么（都错）

实验3-3 比较大小 想知道①和②的区别是什么（都错）

//实验3-3 比较大小 代码① #include<stdio.h> #include<math.h>void swap(int a, int b);// 正确声明 swap 函数int main() {int a, b, c;scanf("%d %d %d",&a,&b,&c);// 比较并交换 a 和 bif (a > b) {swap(a, b);}// 比较并交换 b 和 …
阅读更多...
力扣刷题之3111.覆盖所有点的最少矩形数目

力扣刷题之3111.覆盖所有点的最少矩形数目

题干描述 给你一个二维整数数组 point &#xff0c;其中 points[i] [xi, yi] 表示二维平面内的一个点。同时给你一个整数 w 。你需要用矩形 覆盖所有 点。 每个矩形的左下角在某个点 (x1, 0) 处&#xff0c;且右上角在某个点 (x2, y2) 处&#xff0c;其中 x1 < x2 且 y2 …
阅读更多...
关于vue开发中，高德地图有时不显示的问题

关于vue开发中，高德地图有时不显示的问题

场景1&#xff1a;在弹出框中初始化地图 先设置 this.dialogVisible true; 然后再用nextTick初始化地图 this.$nextTick(() > { this.initAmap(); }); 场景2&#xff1a;点击tab页路由回退&#xff0c;导致高德地图不初始化的问题 解决方法&#xff1a; 通过$refs的方…
阅读更多...
焦化行业超低排放改造巩固提升方案（朗观视觉）

焦化行业超低排放改造巩固提升方案（朗观视觉）

朗观视觉小编观察发现&#xff1a;随着全球对环境保护意识的日益增强&#xff0c;焦化行业作为高污染、高排放的工业领域&#xff0c;其超低排放改造已成为行业转型升级的必然趋势。为了积极响应国家关于推进生态文明建设、打赢蓝天保卫战的号召&#xff0c;山东省生态环境厅发…
阅读更多...
Windows + Ubuntu双系统！小白轻松安装

Windows + Ubuntu双系统！小白轻松安装

前言 这几天有小伙伴想着装WindowsUbuntu双系统&#xff0c;但苦于找不到办法&#xff0c;就在某篇文章后台留言&#xff1a; 这不&#xff0c;今天就更新了嘛&#xff01;虽然做不到有求必应&#xff0c;但教程帖还是可以写写的&#xff0c;能帮一个是一个&#xff01; 今天要…
阅读更多...
深入探讨RCE漏洞及其防御策略

深入探讨RCE漏洞及其防御策略

1. RCE漏洞 1.1. 漏洞原理 远程代码执行&#xff08;RCE&#xff09;漏洞允许攻击者远程注入并执行操作系统命令或代码&#xff0c;从而控制后台系统。 1.2. 漏洞产生条件 调用第三方组件存在代码执行漏洞。用户输入内容作为系统命令参数拼接到命令中。对用户输入的过滤不严…
阅读更多...
关于Linux服务器端更新命令apt update没有效果问题总结(校园网认证)

关于Linux服务器端更新命令apt update没有效果问题总结(校园网认证)

这里写目录标题 项目场景&#xff1a;问题描述错误解决过程个人解决apt update和apt upgrade 项目场景&#xff1a; 在使用Django进行服务器部署的时候&#xff0c;需要使用执行命令 apt update&#xff1a; 具体场景&#xff1a; 问题描述 需要使用apt命令进行升级、下载…
阅读更多...
[HITCON 2017]SSRFme 1

[HITCON 2017]SSRFme 1

目录 代码审计 符号shell_exec() 函数:GET " . escapeshellarg($_GET["url"])&#xff1a;pathinfo($_GET["filename"]basename() 题目解析 代码审计 118.182.186.90 <?phpif (isset($_SERVER[HTTP_X_FORWARDED_FOR])) {$http_x_headers explod…
阅读更多...
二叉树，二叉查找树，平衡二叉树

二叉树，二叉查找树，平衡二叉树

一.绪论: 二.数据结构(二叉树): 1.简介: 1)每一个节点&#xff08;也叫结点&#xff09;都是一个独立的对象-->当中不仅要存数据值&#xff0c;还要存父节点地址值&#xff0c;左子节点地址值&#xff0c;右子 节点地址值 2)没有父节点或者子节点的节点就记为null 2.遍历方…
阅读更多...
【Bug记录】模板生成错误：不属于vector的成员

【Bug记录】模板生成错误：不属于vector的成员

项目场景&#xff1a; 在调用自己写的一个简化版优先级队列时候报语法错误&#xff1a;模板生成错误 问题描述 模板生成错误&#xff0c;如下图 原因分析&#xff1a; 问题的分析&#xff1a;刚开始怀疑写模板写错了&#xff0c;之后看错误列表发现是top函数不属于vector。…
阅读更多...
＜数据集＞棉花识别数据集＜目标检测＞

＜数据集＞棉花识别数据集＜目标检测＞

数据集格式&#xff1a;VOCYOLO格式 图片数量&#xff1a;13765张 标注数量(xml文件个数)&#xff1a;13765 标注数量(txt文件个数)&#xff1a;13765 标注类别数&#xff1a;4 标注类别名称&#xff1a;[Partially opened, Fully opened boll, Defected boll, Flower] 序…
阅读更多...
onespring总结

onespring总结

阅读更多...
llama-factory 系列教程 (六)，linux shell 脚本自动实现批量大模型的训练、部署与评估

llama-factory 系列教程 (六)，linux shell 脚本自动实现批量大模型的训练、部署与评估

背景 最近在做大模型微调训练的评估&#xff0c;每次都要手动训练大模型&#xff0c;手动评估。 发现这样太浪费时间了&#xff0c;于是就尝试着使用linux shell 脚本&#xff0c;利用 for 循环自动实现大模型的训练、部署与评估。 实验&#xff1a;在不同的文本分类数据集尺…
阅读更多...
记录两道关于编码解码的问题

记录两道关于编码解码的问题

环境&#xff1a;php环境即可&#xff0c;也可使用phpstudy。 参考文章: 深入理解浏览器解析机制和XSS向量编码-CSDN博客(很重要) HTML 字符编码&#xff08;自我复习&#xff09;-CSDN博客 例题1&#xff1a; <?php header("X-XSS-Protection: 0"); $xss …
阅读更多...
Shell编程——简介和基础语法(1)

Shell编程——简介和基础语法(1)

文章目录 Shell简介什么是ShellShell环境第一个Shell脚本Shell脚本的运行方法 Shell基础语法Shell变量Shell传递参数Shell字符串Shell字符串截取Shell数组Shell运算符 Shell简介 什么是Shell Shell是一种程序设计语言。作为命令语言&#xff0c;它交互式解释和执行用户输入的命…
阅读更多...
【算法】一文带你搞懂0-1背包问题！（实战篇）

【算法】一文带你搞懂0-1背包问题！（实战篇）

在【算法】一文带你搞懂0-1背包问题&#xff01;&#xff08;理论篇&#xff09;中&#xff0c;讲解了纯0-1背包问题及其原理&#xff0c;本篇文章中进入LeetCode中0-1背包问题应用的实战环节&#xff0c;主要难点其实在于看出是0-1背包问题、转换成0-1背包问题。 416. 分割等和…
阅读更多...
动态卷积（轻量级卷积）替代多头自注意力

动态卷积（轻量级卷积）替代多头自注意力

动态卷积&#xff0c;它比自注意力更简单、更有效。我们仅基于当前时间步长预测单独的卷积核&#xff0c;以确定上下文元素的重要性。这种方法所需的操作数量随输入长度呈线性增长&#xff0c;而自注意力是二次的。在大规模机器翻译、语言建模和抽象摘要上的实验表明&#xff0…
阅读更多...
【论文阅读笔记 + 思考 + 总结】MoMask: Generative Masked Modeling of 3D Human Motions

【论文阅读笔记 + 思考 + 总结】MoMask: Generative Masked Modeling of 3D Human Motions

创新点&#xff1a; VQ-VAE &#x1f449; Residual VQ-VAE&#xff0c;对每个 motion sequence 输出一组 base motion tokens 和 v 组 residual motion tokensbidirectional 的 Masked transformer 用来生成 base motion tokensResidual Transformer 对 residual motion toke…
阅读更多...
机器学习 | 分类算法原理——似然函数

机器学习 | 分类算法原理——似然函数

Hi&#xff0c;大家好&#xff0c;我是半亩花海。接着上次的逻辑回归继续更新《白话机器学习的数学》这本书的学习笔记&#xff0c;在此分享似然函数这一分类算法原理。本章的分类算法原理基于《基于图像大小进行分类》项目&#xff0c;欢迎大家交流学习&#xff01; 目录 一、…
阅读更多...
推荐文章
最新文章

Copyright @ 2022~2023