ReactNative Webview加载本地html异常问题

本文主要解决ios发布release版本时，react native webview加载本地html显示异常问题。

---

产生此问题得条件：

ios加载本地的html，且html内部包含引用外部的js链接（注：链接指向本地），但是，如果你html所有js代码都写在了html上，那就不会下面这些问题。

• eg：我的index.html文件是这样的：

原因：

ios在打包时，react native会把所有非js的文件当作资源来处理，并不会一起打包到index.bundle.js和index.bundle.meta文件中，而你的html会被打包到assets目录下的相对路径中，通过解压ipa可以看到文件结构，如图：。
这个时候你只会看到，解压出来的目录中，html文件内加载的相对路径下的资源并没有被打包进来。这是因为react native认识的只有html这个资源，并不认识html内部引用的其他资源链接。

---

解决办法

如果你没有ios的开发经验，这个时候你可能会一脸茫然（比如我），不过你只需要了解react-native bundle的打包机制即可，而本人是通过下面这个链接，找到了解决办法，推荐一下：https://segmentfault.com/a/1190000006668359，

• 思路：
• 1、把assets链接加到你的ios工程中，具体怎么加，参考上面链接文中提到的，把assets文件夹加到工程的目录中，加入后是这样的，如下图：
• 

• 2、如果你没有加的话，xcode打包后自己也会加进去，但是xcode并不会把你工程目录下的assets自己加进去，而是react native在打包时自动生成的。eg:如下图是ipa解压出来后的目录结构：
  
  而步骤1就是为了能把自己手动添加进assets目录的文件，在xcode编译的时候一并打包进ipa；

• 3、根据你在react native工程放置的html位置，在assets生成相应的目录结构，并放置文件，如下图是我根目录后的文件路径结构：
  

• 4、xcode archive导出ipa，把ipa解压查看目录结构，如图：
• 
  成功打包，工程和运行正常了。

---

致谢
我的朋友（blue）,协助我处理ios的问题，本人对ios原生并不是非常懂，但他给予了我很大的帮助。

---