react-native-web 和 react-native-router-flux 导入问题

Question

当我尝试使用 react-native-web 库来创建浏览器兼容的 react-native app 时，如果该应用程序包含用于路由的 react-native-router-flux 库则不起作用。

webpack 创建的 bundle.js 文件给出了以下错误： Uncaught SyntaxError : Unexpected token import。

Answer 1

使用react-native-router-fluxwith时有一些问题react-native-web。

通天塔编译

大多数 react-native 库都包含未编译的 ES6 JS，所以你需要告诉 Babel 编译这个 Javascript。Babel 忽略了所有内容，node_modules因为你的 webpack 配置中有这一行：exclude: /node_modules/

但是，您不想删除该行。exclude 通常是个好主意node_modules，因为还有很多其他的库不需要编译，所以 Babel 会做很多不必要的工作。

相反，您应该将其添加到您的 webpack 配置中的 loaders 数组中：

  {
    test: /\.js$/,
    include: /node_modules\/react-native-/,
    loader: 'babel-loader',
    query: { cacheDirectory: true }
  },

这将告诉 Babel 编译任何以react-native-.

我写这个答案时还有很多其他问题，但我所有的 PR 都已合并，所以在此之后一切都应该正常工作。