Property assignment expected. ts(1136)

programming web dev
1

I am following book Learning React, chapter 13 page 158, to
first create-react-app helloworld and create HelloWorld.js

import React, {Component} from "react";
class HelloWorld extends Component{
  render() {
    return {
      <div className="helloContainer">
      <h1> Hello World </h1>
      </div>
    };
  }
}
export default HelloWorld;

error message:
at <div , I got “Property assignment expected.ts(1136)”
at className, I got 2 errors
Unreachable code detected.ts(7027)
‘;’ expected.ts(1005)

package.json
{
“name”: “helloworld”,
“version”: “0.1.0”,
“private”: true,
“dependencies”: {
“@testing-library/jest-dom”: “^4.2.4”,
“@testing-library/react”: “^9.5.0”,
“@testing-library/user-event”: “^7.2.1”,
“react”: “^16.14.0”,
“react-dom”: “^16.14.0”,
“react-scripts”: “3.4.3”
},
“scripts”: {
“start”: “react-scripts start”,
“build”: “react-scripts build”,
“test”: “react-scripts test”,
“eject”: “react-scripts eject”
},
“eslintConfig”: {
“extends”: “react-app”
},
“browserslist”: {
“production”: [
“>0.2%”,
“not dead”,
“not op_mini all”
],
“development”: [
“last 1 chrome version”,
“last 1 firefox version”,
“last 1 safari version”
]
}
}

I am using
visual studio code Version: 1.50.0
Commit: 93c2f0fbf16c5a4b10e4d5f89737d9c2c25488a3
Date: 2020-10-07T06:01:33.073Z
Electron: 9.2.1
Chrome: 83.0.4103.122
Node.js: 12.14.1
V8: 8.3.110.13-electron.0
OS: Linux x64 5.4.0-51-generic

Can you help? Thanks!

2

Hi. Your jsx (html) should be wrapped by parens (()) or nothing at all, not curly braces ({}). I think that’s what is causing the error.

1 Like
3

Thanks a lot. That is it.

1 Like