美文网首页iOS 的那些事儿react-native相关
原生应用中集成RN, 生成main.jsbundle

原生应用中集成RN, 生成main.jsbundle

作者: Espero | 来源:发表于2019-04-22 13:56 被阅读0次

    手动集成的ReactNative中,并没有main.jsbundle需要自己手动生成该文件。

    1. 首先进入ReactNative项目的根目录,在此根目录下创建/out/ios文件夹和/out/android文件夹

    2. 打开控制台进入该根目录下,

    iOS:

    react-native bundle --entry-file index.js --bundle-output ./out/ios/index.ios.bundle --platform ios --assets-dest ./out/ios --dev fal

    Android:

    react-native bundle --platform android --dev false --entry-file index.js --bundle-output ./out/android/index.android.bundle --assets-dest ./out/andro

    3.    在对应的ios/ android文件夹下你会发现分别对应生成了(assets和index.ios.bundle

    )和(assets和index.android.bundle)【这里就阐述下iOS的】

    将生成的index.ios.bundle文件复制到项目根目录下,然后打开控制台进入项目根目录下,输入npm start,然后再新建一个控制台(command+N),同样的进入项目根目录,输入

    curl http://localhost:8081/index.ios.bundle -o main.jsbundle

    再次进入根目录会发现生成了main.jsbundle文件了。将此文件放入iOS工程项目中,在AppDelegate文件中修改成下面👇(使用本地资源文件的形式)

    OC写法:jsCodeLocation = [[NSBundle mainBundle] URLForResource:@"main" withExtension:@"jsbundle"];

    Swift写法:let jsCodeLocation =Bundle.main.url(forResource:"main", withExtension:"jsbundle")

    4.    运行,结果发现项目是正常运行了,但是图片却没了,那是因为你还需要在iOS工程项目中,导入之前的assets的资源文件。记得使用Create folder references,导入资源文件。还有改成release模式即可。

    相关文章

      网友评论

        本文标题:原生应用中集成RN, 生成main.jsbundle

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