node.js - Module parse failed top-level-await 实验未启用

Question

import { keyboard } from '@testing-library/user-event/dist/keyboard';
import { RequiredError } from 'openai/dist/base'
import React from 'react'
import { Component } from 'react'
import { Container, Form, Button, Card } from 'react-bootstrap'

const { Configuration, OpenAIApi } = require("openai");

class ProductDescription extends Component {
    constructor() {
        super()
        this.state = {
            heading: 'The response from the AI will be shown here',
            response: '...... await the response'
        }
    }

    onFormSubmit = e => {
        // start by prevening the default
        e.preventDefault()

        const formData = new FormData(e.target),
            formDataObj = Object.fromEntries(formData.entries())
        console.log(formDataObj.productName)
        // OPENAI
        this.setState({
            heading: `AI product description suggestions for: ${formDataObj.productName}`,
            response: 'the response from OpenAI api will be shown here'
        })
    }

    render() {
        return (
            <div>
                <Container>
                    <br />
                    <br />
                    <h1>generate product descriptions</h1>
                    <br />
                    <h4>generate product descriptions for any types of products, simply enter the name and productdescriptions to the card</h4>
                    <br />
                    <br />
                    <Form onSubmit={this.onFormSubmit}>
                        <Form.Group className='mb-3' controlId='formBasicEmail'>
                            <Form.Label>What products would you like to get a description for?</Form.Label>
                            <Form.Control type='text' name='productName' placeholder='Enter product name' />
                            <Form.Text className='text-muted'>Enter as much information as possible for more accurate descriptions</Form.Text>
                        </Form.Group>
                        <Button variant="primary" size="lg" type="submit">Get AI suggestions</Button>
                    </Form>
                    <br />
                    <br />

                    <Card>
                        <Card.Body>
                            <Card.Title><h1>{this.state.heading}</h1></Card.Title>
                            <hr />
                            <br />
                            <Card.Text>
                                <h4>
                                    {this.state.response}
                                </h4>
                            </Card.Text>
                        </Card.Body>
                    </Card>
                </Container>
                <br />
                <br />
                <br />
                <br />
            </div>
        )
    }
}
const configuration = new Configuration({
  apiKey: 'your-api-key',
});
const openai = new OpenAIApi(configuration);

const response = await openai.createCompletion({
  model: "text-davinci-003",
  prompt: "generate product description explanation for the following product  apple iPhone 11\n\nThe Apple iPhone 11 is the latest version of Apple's iconic smartphone. Featuring a stunning new design, an A13 Bionic processor, and a dual rear-facing camera system, the iPhone 11's hardware is designed to give you an amazing mobile experience. With the ability to capture stunning 4K Ultra HD video, and a vibrant Retina HD display, the iPhone 11 provides unbeatable visual and audio quality. Additionally, iPhone 11 features an innovative range of features including Face ID, wireless charging, and a water-resistant body. With the power of iOS 13, you can safely and securely surf the web, communicate with ease, and stay connected with the people that matter most. With the Apple iPhone 11, you have the perfect combination of style and power.",
  temperature: 1,
  max_tokens: 200,
  top_p: 1,
  frequency_penalty: 0,
  presence_penalty: 0,
});
export default ProductDescription

我已经使用了 npm 包，但不知道为什么它会在这个 tutorial 之后抛出错误如果我们注释掉 api 部分而不是所有看起来都很好但不能这样做我想在 react.js 中创建一个内容生成器工具，当我们在输入字段中添加一些查询时以及之后按下提交按钮，我们会得到有关查询的详细段落，如下所示 openai

Answer 1

如果要执行代码，则需要将 await 嵌套到 async 函数中:

(async () => {
  const configuration = new Configuration({
    apiKey: 'your-api-key',
  });
  const openai = new OpenAIApi(configuration);

  const response = await openai.createCompletion({
    model: 'text-davinci-003',
    prompt:
      "generate product description explanation for the following product  apple iPhone 11\n\nThe Apple iPhone 11 is the latest version of Apple's iconic smartphone. Featuring a stunning new design, an A13 Bionic processor, and a dual rear-facing camera system, the iPhone 11's hardware is designed to give you an amazing mobile experience. With the ability to capture stunning 4K Ultra HD video, and a vibrant Retina HD display, the iPhone 11 provides unbeatable visual and audio quality. Additionally, iPhone 11 features an innovative range of features including Face ID, wireless charging, and a water-resistant body. With the power of iOS 13, you can safely and securely surf the web, communicate with ease, and stay connected with the people that matter most. With the Apple iPhone 11, you have the perfect combination of style and power.",
    temperature: 1,
    max_tokens: 200,
    top_p: 1,
    frequency_penalty: 0,
    presence_penalty: 0,
  });
})();

export default ProductDescription;
```