如何解决此语法错误：意外的令牌（1:13）？

Question

我想知道我做错了什么，因为我的代码主要在我的浏览器上显示，我仍然开始，所以慢慢地学习堆栈溢出的谢谢更多技巧的人：）

Card 1.jsx

Syntax error:() Unexpected token (1:13)

> 1 | import React {component} from 'react';
    |              ^
  2 | import '../Card.css'
  3 | 
  4 | const Card = (props) => (

完整代码：

import React {component} from 'react';
import '../Card.css'

const Card = (props) => (
    <div className="card-container">
        <div className ="card">
            <div className ="front">
                <div className="Que">Question</div>
            </div>
            <div classnName ="back">
                <div classnName ="Ans">Answer</div> 
            </div>
        </div>
    </div>
 )

export default Card

Answer 1

import React, {component} from 'react';

Answer 2

只是：import React from 'react';