Javascript 加载基本应用程序时出现导出错误

我正在学习如何反应。但我的基本样品不起作用。 我的app.js文件如下所示

import React, { Component} from 'react';
import './App.css';
import { Greet } from './components/Greet';
class App extends Component {
  render() {
    return <div className="App"> 
    <Greet></Greet>
     </div>
  }
}
export default App;

import React from 'react';
function Greet(){
    return <h1>Test</h1>
}

我的组件文件如下所示

import React, { Component} from 'react';
import './App.css';
import { Greet } from './components/Greet';
class App extends Component {
  render() {
    return <div className="App"> 
    <Greet></Greet>
     </div>
  }
}
export default App;

import React from 'react';
function Greet(){
    return <h1>Test</h1>
}

当我加载我的应用程序时，错误表示尝试导入错误：“Greet”不是从“./components/Greet”导出的。这个错误是什么。如何修复？

您没有问候功能，因此无法将其导入App.tsx

import React from 'react';

export function Greet(){
    return <h1>Test</h1>
}

您没有问候功能，因此无法将其导入App.tsx

---

您忘记导出Greet组件

只需在函数之前添加导出：

---

您忘记导出Greet组件

只需在函数之前添加导出：