用于ReactJS开发的.jsx文件中存在语法错误

用于ReactJS开发的.jsx文件中存在语法错误,reactjs,mean-stack,Reactjs,Mean Stack,嗨,我已经开始学习ReactJS,我已经很难将一个组件插入另一个组件 它说有一个语法错误 知道为什么吗 App.jsx import React from 'react'; import {Header} from './Header.jsx'; class App extends React.Component { render() { var myStyle = { fontSize:100, color:'black' } return (

嗨,我已经开始学习ReactJS,我已经很难将一个组件插入另一个组件

它说
有一个语法错误

知道为什么吗

App.jsx

import React from 'react';
import {Header} from './Header.jsx';

class App extends React.Component {
   render() {
   var myStyle = {
   fontSize:100,
   color:'black'
   }
      return (
         <div style={myStyle}>
            Hello World!!! this is taking so long
         </div>

         <Header/>
      );
   }
}
export default App;
Header.js

import React, { Component} from 'react';

class Header extends React.Component {
   render() {
      return (
         <div className="myHeader">
            header
         </div>
      );
   }
}

export default Header;

组件的内容必须包装在单个标记中

return (
     <div>
         <div style={myStyle}>
            Hello World!!! this is taking so long
         </div>

         <Header/>
     </div>
);

怎么了?也许不值得再问一个问题。对不起,在我删除之前,你一定看到了这个问题。只是我在头的导入名称周围有{}个花括号,去掉它就解决了这个问题。非常感谢。