Javascript 如何在react cdn链接上运行的react项目中导入/导出组件？_Javascript_Reactjs

Javascript 如何在react cdn链接上运行的react项目中导入/导出组件？

javascript reactjs

Javascript 如何在react cdn链接上运行的react项目中导入/导出组件？,javascript,reactjs,Javascript,Reactjs,我在react中做了几个项目，但使用了CreateReact应用程序。我也在尝试做同样的事情，但只是用cdn。我把每个组件都放在单独的.js文件中。但是我很难将这些组件连接到主App.js组件。似乎react not Recogniting是App.js中的一个组件。谢谢 index.php <!DOCTYPE html> <html> <head> <script src="https://unpkg.com/@babel/standalon

我在react中做了几个项目，但使用了CreateReact应用程序。我也在尝试做同样的事情，但只是用cdn。我把每个组件都放在单独的.js文件中。但是我很难将这些组件连接到主App.js组件。似乎react not Recogniting是App.js中的一个组件。谢谢

index.php

<!DOCTYPE html>
<html>
<head>
<script src="https://unpkg.com/@babel/standalone/babel.min.js"></script>
<script crossorigin src="https://unpkg.com/react@17/umd/react.development.js"></script>
<script crossorigin src="https://unpkg.com/react-dom@17/umd/react-dom.development.js"></script>
<script type="text/babel" src="./App.js"></script>
</head>

<body>
    <div id="root"></div>
    <script type="text/babel">

        ReactDOM.render(<App />, document.getElementById('root'));

    </script>
</body>
</html>


ReactDOM.render（，document.getElementById（'root'））；

App.js

import Header from './Component/Header.js'

class App extends React.Component {
    render() {
      return (
          <div>
             <Header />
             <h2>Hi, I am a Main!</h2>;
          </div>
      ) 
    }
}

从“./Component/Header.js”导入头文件
类应用程序扩展了React.Component{
render（）{
返回(
嗨，我是一个主要的！；
) 
}
}

Header.js

class Header extends React.Component {
    render() {
      return <h2>Hi, I am a Header!</h2>;
    }
  }

export default Header

类头扩展React.Component{
render（）{
回击你好，我是头球！；
}
}
导出默认标题

打开控制台。阅读错误消息。“我正在尝试做同样的事情，但只使用react cdn。”-我真的不会。它效率低下，不允许您使用npm和webpack提供给您的所有有用工具。