react native openai jsx

反应本机 openai-jsx

⚛️？ ？使用 OpenAI 生成功能性的React Native组件！看看它的实际效果！ ？

只需提供一些有关您希望看到的内容的高级描述，就可以使用react-native-openai-jsx来创建真实的、工作的React Native应用程序。

例如：

 import { Alert } from 'react-native' ;
import { Prompt } from 'react-native-openai-jsx' ;

export default function App ( ) : JSX . Element {
  return (
    < Prompt
      extraProps = { React . useMemo ( ( ) => ( {
        onPress : ( message : string ) => Alert . alert ( message ) ,
      } ) , [ ] ) }
      prompt = { [
        'Provide a complete example of a React Native View component which contains a big Button in the center with the text "Press Me".' ,
        'When the Button is pressed, it must call a function prop passed into the component called onPress with the parameter "Hello from OpenAI!".' ,
      ] . join ( ' ' ) }
    / >
  ) ;
}

这看起来可能很疯狂，但这确实有效！通过使用openai客户端库，我们可以使用他们复杂的机器学习模型来为我们想象功能性的 React Native 应用程序。在运行时，我们可以使用@babel/runtime将自动生成的模块转译为运行时友好的 JavaScript，并使其在react-native-wormhole之上执行。

入门

首先，您需要安装react-native-openai-jsx和react-native-url-polyfill ：

yarn add react-native-openai-jsx react-native-url-polyfill

下载时，您需要为 OpenAI 创建一个客户端 API 密钥（如果您还没有）。您可以在此处找到有关如何执行此操作的说明。

注意：您需要react-native-url-polyfill才能与官方openai SDK兼容。

接下来，在应用程序的根目录将polyfills导入到应用程序的入口点，即：

 + import 'react-native-url-polyfill/auto';

import { AppRegistry } from 'react-native';
import App from './src/App';
import { name as appName } from './app.json';

AppRegistry.registerComponent(appName, () => App);

这应该就是一切了！

要看到这一切结合在一起，您可以免费尝试example应用程序：

 cd example/
OPENAI_API_KEY="<your-api-key>" yarn (ios|android|web)

？配置

<Prompt />组件公开了所有接口功能，以开始创建和自定义您自己的语言模型提示。

姓名	类型	描述	默认值
prompt	string?	用于向机器学习模型建议创建什么应用程序的文本字符串。	旨在评估为空React.Fragment的条件。
completionSettings	CompletionSettings	CreateCompletionRequest对象。	必需的
style	StyleProp<ViewStyle>?		undefined
debug	boolean?	用于渲染转译期间的错误并预览 OpenGPT 生成的响应。	false
extraProps	<T>	可用于传递到 OpenGPT 的自定义对象。例如，您可以传递回调函数并指示机器学习模型它作为可能的 prop 存在。	{}
Wormhole	React.FC	一个Wormhole 。这可用于包括对其他库的支持，例如react-native-svg 。	DefaultWormhole

请不要忘记，为了使该库取得任何成功，您必须在提示中告知机器学习模型您正在尝试创建 React Native 应用程序。

✌️ 许可证

麻省理工学院