美文网首页
(爬坑)React-Native项目运行之路

(爬坑)React-Native项目运行之路

作者: SA_Arthur | 来源:发表于2019-03-15 15:44 被阅读0次

    追随着时代的脚步(?),采取着“还有头发,还能学”的方针,我从GitHub下载了React-Native项目,准备开始学习......
    然后我就进入了报错天堂......
    我承认我的英文水平全靠看报错提升的....


    环境:macOS
    Xcode:Version 10.1
    Android Studio:Version 3.2

    以下是遇到的报错和它的解决方法....至于为什么会报错,为什么这样解决,别问我,我也不知道......等哪天我研究透了可能再来补充.......


    报错1:Cannot find entry file index.android.js in any of the roots

    在react native以前的版本,index.android.js与index.ios.js是分开的两个文件,在最新版本中这两个文件合并成index.js一个文件了。但是如果你在创建项目之后直接运行,肯定会报Cannot find entry file index.android.js in any of the roots这种类似的错误,因为在根目录下已经不存在index.anroid.js和index.ios.js这两个文件,所以肯定不会检索到,你更改App.js的内容后更不可能生效。(https://www.cnblogs.com/honeynm/p/9007072.html

    解决方法:

    • 创建assets目录(android/app/src/main/assets)
    react-native bundle --platform android --dev false --entry-file index.js --bundle-output ./android/app/src/main/assets/index.android.bundle --assets-dest ./android/app/src/main/res/
    
    • 之后assets目录下就会生成

    • 之后在运行react-native run-android

    • PS:有个很奇怪的点是,当我改动了文件,要在Android Studio上跑的时候,需要把assets文件夹里面的文件删除,重新进行一次上面第二个步骤,才能显示修改,请教有没有大佬知道是为什么?

    报错2:Android 报错 react native syntaxError:Attempted to redefine property "xxxx"

    项目内有某个属性“xxxx”被定义了多次,例如:


    解决方法:
    需要删除/注释一个,这在IOS运行时是可以的,但是Android会报错。

    报错3:Android Error:Execution failed for task ':app:lintVitalRelease'

    解决方法:
    android/app/build.gradle里的android{}中添加

    lintOptions {
        checkReleaseBuilds false
        abortOnError false
    }
    

    报错/错误4:运行Android模拟器

    解决方法:
    用Android Studio查看项目时,我是跑在模拟器(夜神)上看效果,所以这时候需要连接模拟器,网上有各种连接模拟器的方法,基本都是Windows,不过方法差不多,只是Mac的地址是/你的主机名/Macintosh-HD/Applications/Nox\ App\ Player.app/Contents/MacOS,如果输入到终端没办法跳转的话,就需要一级一级往下找了。
    然后运行adb connect 127.0.0.1:62001

    在Android Studio中,需要改成:


    连接上的时候会有设备提示,如果找不到设备,重启模拟器就好了。

    报错5:Android Error:moudle not specified

    在上一个问题中,配置里有个Module,一般显示的就是项目名,如果显示的是<no module>,并且你刚好又是第一次运行RN项目,什么也不懂,那么你需要查看一下,你用Android Studio打开的是不是RN项目目录.......
    如果是,改成打开RN项目目录下的android文件夹:)

    问题6:Android打包

    https://blog.csdn.net/u011272795/article/details/77161942
    基本根据这个文章配置就可以打包成功了,没有成功就要一个一个解决报错了。

    报错7:You have not accepted the license agreements of the following SDK components

    缺少对应的包。
    解决方法:
    看提示(例如Android SDK Platform 23)下载相应的包。



    勾选然后下载即可。

    报错8:A problem occurred configuring project ‘:app’

    解决方法:
    android文件夹下创建local.properties,然后写入
    sdk.dir=你本地Android SDK文件夹路径


    如果不知道sdk路径,打开Android Studio的SDK Manager就能看到了。
    参考一下上一个问题的图。

    问题9:打包发布

    参考:https://blog.csdn.net/qq_38719039/article/details/80848290

    问题10:IOS '......libfishhook.a'

    error: Build input file cannot be found: '/Users/../node_modules/react-native/Libraries/WebSocket/libfishhook.a'

    解决方法:


    删除该标记下的libfishhook.a,然后重新添加一个就可以。

    报错11:_react2.default.createContext is not a function

    解决方法:
    升级react版本即可:

    //before:
    "react": "^16.2.0",
    "react-dom": "^16.2.0",
     
    //after update:
    "react": "^16.7.0",
    "react-dom": "^16.7.0",
    

    报错12:Application XXX has not been registered

    解决方法:
    1、注册方法写错

    AppRegistry.registerComponent('MyDemo', () => MyDemo);
    

    2、端口被占用
    输入react-native start,如果出现Packager can't listen on port 8081,就说明端口被占用,杀死进程即可。

    lsof -i :8081
    kill -9 <PID>
    

    报错13:RNGestureHandlerModule.State error

    解决方法:
    这是在使用react-native出现的报错,是因为没有连接造成的。

    react-native link react-native-gesture-handler
    

    报错14:Command PhaseScriptExecution failed with a nonzero exit code

    运行xcode模拟器显示的报错,是因为Xcode10是默认选中的最新的New Build System(Default),在这个编译系统的环境下,打包的CI脚本一直会报错。
    解决方法:
    File>Project Setting...


    相关文章

      网友评论

          本文标题:(爬坑)React-Native项目运行之路

          本文链接:https://www.haomeiwen.com/subject/cynkmqtx.html