I keep encountering a parsing error while trying to run my React application The compilation fails with the following error message: ./src/App.js Line 7: Parsing error: Unexpected token, expected "{"
After reviewing my code, I couldn't find any unexpected tokens.
import React from 'react';
import logo from './logo.svg';
import './App.css';
import './game.html';
import Grid from './board.js';
class App extends from React.Component {
render(){
return(
<div className="game-board">
<Grid/>
</div>
);
}
}
export default App;
import React from 'react';
import Square from './square.js';
class Grid extends React.Component{
renderSquare(i)
{
return <Square value={i}/>
}
render(){
<div className="gamerow">
{this.renderSquare(1)}
{this.renderSquare(2)}
{this.renderSquare(3)}
</div>
<div className="gamerow">
{this.renderSquare(4)}
{this.renderSquare(5)}
{this.renderSquare(6)}
</div>
<div className="gamerow">
{this.renderSquare(7)}
{this.renderSquare(8)}
{this.renderSquare(9)}
</div>
}
}
export default Grid;
import React from 'react';
//import Grid from './board.js
class Square extends React.Component{
render(){
return(
<button className= "square">{this.props.value}
</button>
);
}
}
I have added 'export default Square;' line in anticipation of displaying a 3 by 3 grid on the UI.