使用 React Native for Android 从捆绑包中加载 JS/CSS答案

【问题标题】：Load JS/CSS from bundle package with React Native for Android使用 React Native for Android 从捆绑包中加载 JS/CSS
【发布时间】：2016-11-22 04:43:16
【问题描述】：

我见过很多解决方案，用于从捆绑包中加载 JS/CSS，以及针对 iOS 的 React Native 应用程序，例如 this，但不适用于 Android。

我的 webview 代码是这样的：

<WebView
  source={{html: html, baseUrl: `file:///android_asset/web`}}
/>

html 变量是这样的：

const html = `
<html>
  <head>
    <link rel="stylesheet" type="text/css" href="styles.css" />
  </head>
  <body>
    <p class="someText">Foo</p>
  </body>
</html>`

我的项目目录如下所示：

app
  -> assets
  -> web
    -> styles.css

如果有人对此有解决方案，那就太棒了。

【问题讨论】：

标签： android react-native

【解决方案1】：

将styles.css放在以下路径：

/android/app/src/main/assets

然后，将<WebView> 的 baseURL 设置为：

<WebView source={{html: html, baseUrl: 'file:///android_asset/'}} />

P.S：每次更改样式时都必须执行react-native run-android。

【讨论】：

我的代码几乎可以工作，除了<link> 中的href 应该以/web 为前缀。
@NaotoIda 我认为问题是因为您的 baseUrl 中缺少尾随 /，它应该是 'file:///android_asset/web/'。解决此问题后，无需在 href 中添加“/web”前缀。