我目前的目标是通过使用 npm 模块来使天气小部件工作https://react-open-weather.gitbook.io/project/。这是一个 React 组件，这是我以前从未使用过的东西。
我已经采用了 npm 模块提供的 CDN，但除此之外，我不知道如何以某种方式“启用”我的 JS 文件来读取 React 组件，或者如何集成它。我之前尝试过这个链接（https://reactjs.org/docs/add-react-to-a-website.html）来询问这里的问题，但是东西开始损坏（请参阅下面的代码片段）。
问题是我不知道如何使用 React，我把它搞砸了。这就是我现在求助于你的原因：有 React 经验的人可以在这里帮助我吗？
以下react组件是我需要按城市名称加载今天的天气数据的方式：
<ReactWeather
forecast="today"
apikey="bdb591c14b9e4a079623b1a838313888"
type="city"
city="Copenhagen"
/>
我的项目是用 vanilla JS 构建的，所以我需要帮助将此组件集成到我的文件中。
<head>
<link rel="stylesheet"
href="https://cdnjs.cloudflare.com/ajax/libs/weather-icons/2.0.9/css/weather-
icons.min.css"
type="text/css"/>
</head>
<body>
<section id="weather">
<div class="weather_component_container"></div>
</section>
<!-- npm module for weather -->
<script src="node_modules/react-open-weather/lib/js/ReactWeather.js"></script>
<!-- Load React -->
<script src="https://unpkg.com/react@17/umd/react.development.js" crossorigin></script>
<script src="https://unpkg.com/react-dom@17/umd/react-dom.development.js" crossorigin></script>
<!-- Load our React component -->
<script src="weather.js"></script>
<script src="script.js"></script>
</body>
我从 https://reactjs.org/docs/add-react-to-a-website.html 获取了以下启动代码，并将其替换为我的 DOM 元素，即 #weather
这是我在控制台中收到的错误：““数据”参数必须是字符串、Buffer、TypedArray 或 DataView 类型之一。接收到的类型对象”
天气.js
'use strict';
React.createElement(ReactWeather, {
forecast: "today",
apikey: "bdb591c14b9e4a079623b1a838313888",
type: "city",
city: "Copenhagen"
});
ReactDOM.render(
document.getElementById('weather')
);
默认情况下，JavaScript 不理解 JSX 语法。你可能会错过这个文档： https://reactjs.org/docs/add-react-to-a-website.html#quickly-try-jsx
请添加脚本并重试
<script src="https://unpkg.com/babel-standalone@6/babel.min.js"></script>
注意：不要在生产中使用此脚本，因为它可能会减慢您的应用程序的速度。要在生产中使用，请参阅文档 https://reactjs.org/docs/add-react-to-a-website.html#add-jsx-to-a-project