Get "SyntaxError ... Unexpected token" message when importing React Component in a Create-React-App project.

[kwafok]

I have made this repo: https://github.com/kwafok/paraviewweb_react_test to show the problem.

The test project is created by create-react-app. I added some dependencies such as normalize.css and paraviewweb. Then, I copy this example https://kitware.github.io/paraviewweb/docs/import.html#React-component to the index.js. (https://github.com/kwafok/paraviewweb_react_test/blob/master/src/index.js#L70)

I also updated the index.html to have this line <div id="root" class="content"></div> for rendering the <GitTreeWidget /> component.

This is the error message:

C:\projectpath\paraviewweb_react_test> npm run start

> paraviewweb_react_test@0.1.0 start C:\projectpath\paraviewweb_react_test
> react-scripts start

i ｢wds｣: Project is running at http://0.0.0.0:3000/
i ｢wds｣: webpack output is served from
i ｢wds｣: Content not from webpack is served from C:\projectpath\paraviewweb_react_test\public
i ｢wds｣: 404s will fallback to /
Starting the development server...
Failed to compile.

./node_modules/paraviewweb/src/React/Widgets/GitTreeWidget/index.js
SyntaxError: C:\projectpath\paraviewweb_react_test\node_modules\paraviewweb\src\React\Widgets\GitTreeWidget\index.js: Unexpected token (292:8)

  290 |
  291 |       return (
> 292 |         <g key={`node-${index}`} className={style.cursor}>
      |         ^
  293 |           <circle
  294 |             data-id={el.y}
  295 |             cx={cx}