Javascript 如何为不同的构建类型/风格构建react本机组件？

在react native上，有一个功能是我们可以使用组件文件后缀根据平台构建不同的组件，即

component.ios.js

和

component.android.js

将为ios和android构建一个具有特定行为的

component

模块

有没有办法根据构建变体/风格/方案构建不同的组件？比方说，假设我有一个

pro

和一个

lite

版本的应用程序，我想这样做：

| some-folder/
| -- component.pro.js
| -- component.lite.js

因此，当我从“某个文件夹/组件”导入组件时，绑定器可以检测我是否在使用

pro

或

lite

构建变量，并以与操作系统后缀类似的方式绑定正确的javascript文件

请注意，我知道我可以在运行时检查构建变量并正确提供正确的组件，但这意味着在应用程序中捆绑错误变量的代码-不必要地增加应用程序大小

相关的，是否有方法根据构建变量有条件地导入图像？我知道我可以将它们放在每个本机平台各自的资产文件夹中，但我想知道是否还有其他方法

---

非常感谢您的帮助。

不，这是不可能的，因为React Native将在文件具有.ios时检测到。或者，安卓。扩展并加载每个平台的正确文件

您必须为每个文件编写自己的包装器，如

组成部分

-->component.pro.js

-->component.lite.js

-->index.js

在index.js文件中，您可以从react native检查平台或操作系统，并返回特定的文件

例如文件

import ComponentPro from './component.pro.js';
import ComponentLite from './component.lite.js';
import {Platform} from 'react-native';

export defualt Component=(props)=>{
  if (platform.os==='pro') return <ComponentPro {...props}/>;
  else if (platform.os==='lite') return <ComponentLite {...props}/>;
}

从'./component.pro.js'导入ComponentPro；
从“/component.lite.js”导入ComponentLite；
从“react native”导入{Platform}；
导出解除组件=（道具）=>{
if（platform.os==='pro'）返回；
else if（platform.os=='lite'）返回；
}

不，这是不可能的，因为React Native会在文件具有.ios时检测到。或者，安卓。扩展并加载每个平台的正确文件

您必须为每个文件编写自己的包装器，如

组成部分

-->component.pro.js

-->component.lite.js

-->index.js

在index.js文件中，您可以从react native检查平台或操作系统，并返回特定的文件

例如文件

import ComponentPro from './component.pro.js';
import ComponentLite from './component.lite.js';
import {Platform} from 'react-native';

export defualt Component=(props)=>{
  if (platform.os==='pro') return <ComponentPro {...props}/>;
  else if (platform.os==='lite') return <ComponentLite {...props}/>;
}

从'./component.pro.js'导入ComponentPro；
从“/component.lite.js”导入ComponentLite；
从“react native”导入{Platform}；
导出解除组件=（道具）=>{
if（platform.os==='pro'）返回；
else if（platform.os=='lite'）返回；
}