首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

window环境下搭建react native及相关插件

注意,目前已知Node 7.1版本windows上无法正常工作,请注意避开这个版本!...React Native的命令行工具用于执行创建、初始化、更新项目、运行打包服务(packager)等任务。...保持packager开启,另外打开一个命令行窗口,然后工程目录下运行 react-native run-android 首次运行需要等待数分钟并从网上下载gradle依赖。...这个时间可能耗时很久,也可能会不停报错链接超时、连接中断等等——取决于你的网络状况和墙的不特定阻断。) 运行完毕后可以模拟器或真机上看到应用自动启动了。 ? ?...执行react-native run-android命令 这里给我提上了一个错误,说必须是项目级别,也就是我们这里项目的最外层。 ?

2.5K80

ReactNative报错记录以及原因分析 ReactNative报错记录

查看network信息 ReactNative项目运行的两种方式 命令行运行(ReactNative项目根目录下)react-native run-android android studio运行...react-native start 然后就可以android studio像启动其它原生app项目一样启动项目了。...报错描述: android studio启动ReactNative项目的时候报错,报错信息如上。通过命令行react-native run-android启动ReactNative项目不会报错。...请查阅:AndroidStudio运行React-Native项目 打包和发布index.android.js;请查阅:react-native启动红屏报错:Unable to load script.Make...我的项目之所以出问题是因为,项目集成rn本地的仓库地址做了更新, 走错了仓库, 所以没有拿到正确的本地maven地址.

4.4K10
您找到你想要的搜索结果了吗?
是的
没有找到

ReactNative环境搭建扩展篇——安装后报错解决方案

init xxx(项目名称);     b).模拟器或手机安装app:进入项目根目录执行命令:react-native run-android;执行完此命令之后,如果是第一次运行,命令会帮你在手机或者模拟器创建一个...app的“壳子”以后运行都是基于这个app的,手机上只要有这个app之后,启动调试就不需要react-native run-android运行安装项目了,因为“壳子”的安装只需要一次,以后只需要启动服务即可...翻译中文:无法加载文件index.android.bundle 产生原因:ad项目在编译运行的时候,win10上没有创建编译目录导致的。...run-android 错误二:Could not connect to development server....也可以RN开发浮层上设置启动 Hot Reloading,每次文件修改都会自动刷新,大大节约了调试的时间! 解决了以上2个问题,第一次运行RN App的问题就已经全部解决了,祝使用愉快!

1.1K80

mac上配置react-native环境run-iosrun-android命令遇到的问题

新报错(rn版本:0.53.3)2018.3.6 今天react-native环境,遇到了一些坑,这里记录一下。 首先最重要的一点是一定要按官网一步一步来,不然可能会出现一些奇奇怪怪的问题!...gradle和权限问题 gradle默认都是下载2.14.1的,run-android可能会出现下载失败或者长时间下载不了,这时就手动去下载。...mac调用本地文件可能会出现权限问题,这时选中你的项目文件夹,右键选择显示简介,拉到最下面,如下图: ? 先点击小锁,输入密码解锁,然后点击设置图标按钮,选择应用到包含的项目,确定,点击小锁锁定。...run-android,成功运行~ ps:修改权限后 android/gradlew 文件引起了一个问题(虽然文件内容没有变化,但是文件git上是有变化可以上传的),另一台window电脑上使用...mac修改权限后的gradlew文件引发了如下错误: ?

1.4K30

React-Native androidwindows下的踩坑记

官网上也提到node的最低版本要求 https://github.com/facebook/react-native 更新完node后 一切正常了,你可以浏览器里访问:http...platform=android 保留packager的dos窗口,新建另外一个dos窗口,切换至项目目录下:react-native run-android 报错了,你需要设置...platform=android,浏览器能正常访问但手机访问packager的DOS窗口没有看到log输出,那么你可以尝试使用下面的命令: 参考网址:http://stackoverflow.com...DOS窗口,启动应用:react-native run-android ------- update by 2015/11/30 使用最新版本的react-native(0.15.0),因为之前本机已经成功运行过...react-native,再次按照上面的几个命令操作的时候,发现真机运行会报错: ReferenceError: Can't find variable: require(line 1 the generated

1.8K30

mac上配置react-native环境run-iosrun-android命令遇到的问题

新报错(rn版本:0.53.3)2018.3.6 今天react-native环境,遇到了一些坑,这里记录一下。 首先最重要的一点是一定要按官网一步一步来,不然可能会出现一些奇奇怪怪的问题!...gradle和权限问题 gradle默认都是下载2.14.1的,run-android可能会出现下载失败或者长时间下载不了,这时就手动去下载。...mac调用本地文件可能会出现权限问题,这时选中你的项目文件夹,右键选择显示简介,拉到最下面,如下图: ? 先点击小锁,输入密码解锁,然后点击设置图标按钮,选择应用到包含的项目,确定,点击小锁锁定。...run-android,成功运行~ ps:修改权限后 android/gradlew 文件引起了一个问题(虽然文件内容没有变化,但是文件git上是有变化可以上传的),另一台window电脑上使用...mac修改权限后的gradlew文件引发了如下错误: ?

1.5K30

React-Native 入门

优点: 直接依托于操作系统,交互性最强,性能最好 功能最为强大,特别是与系统交互,几乎所有功能都能实现 缺点: 开发成本高,无法跨平台 升级困难 维护成本高 Web App 即移动端的网站,将页面部署服务器上...node_modules: react-native 工程用到的模块。 App.js 是 react-native 工程的主源码文件,入口文件,相当于 html 的 index.html。...项目运行之前,确保配置了 Android 开发环境,并且命令行可以运行 adb 命令,adb Android SDK 的 platform-tools 文件夹下,需要手动添加至环境变量。...下载完成后,放到指定目录下: image.png 然后重新输入命令 react-native run-android 来初始化运行项目,程序首先会解压 gradle 压缩文件,第一次初始化可能需要一点时间...四、常见错误 1、没有配置 Android 开发环境 当第一次输入 react-native run-android 运行是,出现如下错误: image.png 表明程序没有找到 sdk 路径,首先确定是否配置了

2.7K10

逻辑性最强的React Native环境搭建与调试

二、APP调试与运行 1、创建项目   react-native init demo1 2、安装依赖包   进入demo1根目录执行:npm i 3、启动服务器   react-native start...platform=android可以访问,即启动完成,启动之后不能关闭; 4、安装app   react-native run-android   输入此命令前,要先打开模拟器,或连接真机,第一次启动非常慢...gradle\wrapper\dists\gradle-2.14.1-all\8bnwg5hd3w55iofp58khbp6yv     如果手动安装需要执行:react-native run-android...重新启动; 5、运行调试app   本人用的是Visual Studio Emulator for Android(模拟器)运行的,真机或其他模拟器相同,第一次运行会出现错误,如图: ?   ...三、扩展知识(重要):每次修改完程序都要摇一摇Reload很麻烦,这个时候有一个很方便的做法开启热加载,改动完之后,即可在app自动更新,设置如图: ?

1.8K70

ReactNative android 之 (A problem occurred configuring project app.异常)

问题1:使用 node 安装 reactNative 完成之后,启动命令: react-native run-android 的时候,报这个错误信息,例如: SDK platform 23 也安装了,...但是依旧报这个错误信息 查了半天资料,有的说是 缺少 ==local.properties== 文件,有的说是==build.gradle==文件丢失,有的说是SDK的问题,还有的说是环境变量的问题。...各个都说的没错,这些确实都有关系,在这里教给大家一个快速解决的办法: 1、首先,先打开 studio64 安卓开发工具,建立一个简单的(Hello World)项目,先跑起来,看看能否运行,如果不能,那说明是可能是环境变量...、SDK什么的没有配置好,如果可以正常运行, 2、引入node 创建完成的项目,用 android studio 打开,android studio 会有警告提示,点击update,过几分钟更新build...完成即可, 3、最后,命令行输入:react-native run-android 运行即可!

1.3K20

每位开发人员都应该有一款的GitHub最受欢迎与最热项目浏览器发布@GitHubPopular

项目源码 English 目录 功能与特性 下载安装 预览图 运行调试 ToDo 功能与特性 支持订阅 50 多种编程语言; 支持添加/删除编程语言,并支持自定义它们的排序; 支持收藏喜欢的项目; 支持多种颜色主题自由切换...运行调试 准备React Native环境,可参考: Requirements。 Clone GitHubPopular,然后终端进入项目根目录。 终端运行 npm i。...然后运行 react-native run-ios 或 react-native run-android。...Ok,有问题可以提issues出来 ToDo V2.0规划 [ ] 上滑自动隐藏NavBar [ ] 文字支持大、、小 [ ] 夜间模式 [ ] 使用Redux [ ] i18国际化 最后 既然来了,...留下个喜欢再走吧,鼓励我继续创作(^_^)∠※ 如果喜欢我的文章,那就关注我的博客@ devio.org吧,让我们一起做朋友~~ 这里,加关注哦: 微博:第一时间获取推送 个人博客:干货文章都在这里哦

71070

React Native学习笔记(1) 环境配置,项目结构,开发环境结构

server react-native start 启动android react-native run-android 启动ios react-native run-ios 开发环境的组成 一个node.js...的开发服务器,开发阶段,我们的电脑上需要开启这个web服务,以使得模拟器可以显示内容。...当我们更改了js源代码后,也能及时的模拟器里看到。 模拟器设备,就是我们开启的Android或者IOS虚拟机 jsBundle 开发者写的源代码打包而成,开发阶段更改js文件会自动更新到模拟器。...网上还有一些“热更新”的方案。 ? 开发环境的组成 项目结构 ?...: react-native start 启动服务 执行 react-native run-android 启动android ,稍等片刻就可以Android模拟器里看到页面了

1.1K00

React-Native 遇到的错误1. React-Native 部分组件debug模式下打包在iOS真机上可以显示,但是release模式下打包在iOS真机上不显示2. React-Native

React-Native 部分组件debug模式下打包在iOS真机上可以显示,但是release模式下打包在iOS真机上不显示 ? 显示 ?...React-Native 启动时报错 - “no bundle url present” 原因 我运行react-native run-android看了一下安卓环境下的图标的样式,然后使用react-native...解决 于是我就在iOS模拟器正在运行期间执行了: npm install react-native run-ios zz,一遍还不行,试了两遍才正常了!!!...ReactNative js调试变得很卡 解决办法 把那个chrome的Tab页保持最前,窗口不要最小化就好了。也就是下面这个页面不要关,保持最前面就好了。 ?...解决办法 只需要这样更新代码即可。 ? fix.png

1.9K30

react-native学习之入门app

1、项目初始化: react-native init MyProject 2、启动项目: cd MyProject react-native start 新开cmd窗口: react-native run-android...3、源代码分析: 附上index.android.js文件: /* * Sample React Native App * https://github.com/facebook/react-native...React, { Component } from 'react'; import { AppRegistry, StyleSheet, Text, View } from 'react-native...的相关组件模块,这样我们自定义组件的时候可以直接返回react自身的元素(react组件自定义,必须实现render方法,并且返回一个react element,而且有且仅有一个被包含的顶层元素) 然后通过...4、真机运行时,可以摇晃手机,弹出的工具框中选择Reload Js,进行js代码的重新安装,可以直接看到修改后的运行效果,也可以直接单击选中“支持热更新”,从而实现ide更新后,app端自动更新效果

1.1K00

VS Code开发React-Native及Flutter 开启无线局域网安卓真机调试问题

笔者前段时间在做react-native开发,一直是有线连接安卓真机进行调试的。...有线调试确实带来诸多麻烦,因为调试过程需要频繁和手机进行交互,导致有时候数据线脱落,就不得不重新安装debug apk,安装一次应用的时间大概一到三分钟,大量的误触就使得花在安装应用花费的时间比较长...React-Native 无线调试教程: 首先基本步骤跟flutter一样,无线连接成功后拔掉数据线,运行 yarn run android(react-native run-android)= 具体看...不要慌,问题不大,这表明debug apk已经安装上了,只是加载不了脚本,所以要在电脑上运行脚本服务器,让安卓从电脑的端口动态获取脚本并执行(也就是hot reload热更新vscode终端运行...指定的端口运行,然后浏览器打开该端口地址 ?

2.4K30
领券