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

手动集成的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)