创建React Native的第一个hello world工程

创建React Native的第一个hello world工程

需要安装好node、npm环境

如果之前没有安装过react-native-cli脚手架的,可以按照下述步骤直接安装。如果已经安装过的,但是在使用这个脚手架初始化工程的时候遇到下述报错的话

ts 复制代码
cli.init(root, projectname);
      ^
typeerror: cli.init is not a function
    at run (c:\users\showbi\appdata\roaming\npm\node_modules\react-native-cli\index.js:302:7)
    at createproject (c:\users\showbi\appdata\roaming\npm\node_modules\react-native-cli\index.js:249:3)
    at init (c:\users\showbi\appdata\roaming\npm\node_modules\react-native-cli\index.js:200:5)
    at object.<anonymous> (c:\users\showbi\appdata\roaming\npm\node_modules\react-native-cli\index.js:153:7)
    at module._compile (node:internal/modules/cjs/loader:1105:14)
    at object.module._extensions..js (node:internal/modules/cjs/loader:1159:10)
    at module.load (node:internal/modules/cjs/loader:981:32)
    at function.module._load (node:internal/modules/cjs/loader:822:12)
    at function.executeuserentrypoint [as runmain] (node:internal/modules/run_main:77:12)
    at node:internal/main/run_main_module:17:47

也可以先直接卸载

ts 复制代码
npm uninstall -g react-native-cli

正常安装过程:

  1. 安装react-native-cli
ts 复制代码
npm install -g react-native-cli
  1. 安装react-native
ts 复制代码
npm install -g react-native

安装完成之后,可以用脚手架来初始化项目

TS 复制代码
npx react-native init firstRNProject

就会出现下述的界面

安装编译到Android手机上去

ts 复制代码
react-native run-android

启动以后的界面如下所示:

在这个过程中可能会遇到一些版本带来的问题,

相关推荐
咸鱼翻面儿2 分钟前
Javascript异步,这次我真弄懂了!!!
javascript
brrdg_sefg3 分钟前
Rust 在前端基建中的使用
前端·rust·状态模式
m0_7482309427 分钟前
Rust赋能前端: 纯血前端将 Table 导出 Excel
前端·rust·excel
qq_5895681035 分钟前
Echarts的高级使用,动画,交互api
前端·javascript·echarts
小白学大数据1 小时前
高级技术文章:使用 Kotlin 和 Unirest 构建高效的 Facebook 图像爬虫
爬虫·数据分析·kotlin
黑客老陈2 小时前
新手小白如何挖掘cnvd通用漏洞之存储xss漏洞(利用xss钓鱼)
运维·服务器·前端·网络·安全·web3·xss
正小安2 小时前
Vite系列课程 | 11. Vite 配置文件中 CSS 配置(Modules 模块化篇)
前端·vite
暴富的Tdy2 小时前
【CryptoJS库AES加密】
前端·javascript·vue.js
neeef_se2 小时前
Vue中使用a标签下载静态资源文件(比如excel、pdf等),纯前端操作
前端·vue.js·excel