1

我使用react-native-web，我想创建跨平台组件。我想按平台区分每个组件。

所以我跟着这个教程：https ://www.smashingmagazine.com/2016/08/a-glimpse-into-the-future-with-react-native-for-web/

我有 3 个文件：
     -friendsList.android.js
     -friendsList.ios.js
     -friendsList.web.js

对于导入FriendsList，在index.android.js, 中index.ios.js index.web.js： 

Import FriendsList from './friendsList';

在 iOS 和 Android 上，它运行良好。但是在网络上，它无法识别该文件。我实际上有 3 个解决方案：
-在导入时指定：import FriendsList from './friendsList.web';
-定义为每个平台调度的服务
- 或在 webpack 中定义别名： 

 resolve: {
        alias: {
            'react-native': 'react-native-web',
            './friendsList': './friendsList.web',
        },
    },

有没有办法在没有这种方式的情况下导入 .web ？
也许不应该那样做？

4

1 回答 1

2

根据react-native-web 入门文档，您需要设置扩展。

resolve: {
  // Maps the 'react-native' import to 'react-native-web'.
  alias: {
    'react-native': 'react-native-web'
  },
  // If you're working on a multi-platform React Native app, web-specific
  // module implementations should be written in files using the extension
  // `.web.js`.
  extensions: [ '.web.js', '.js' ]
}
于 2017-06-07T18:13:12.647 回答