Usage with react

[rob-myers]

I'm trying to follow your /Getting-Started.

When attempting to extend CircularNodeView, the render method has return type VNode. I can see you are using snabbdom-jsx here. However, this module uses global typings which conflict with @types/react -- which I am using for other parts of the app.

How am I to proceed? Many thanks for any help.

[JanKoehnlein]

It looks like these brand new TS features could help: https://blogs.msdn.microsoft.com/typescript/2018/03/27/announcing-typescript-2-8/#jsx-pragma-comments https://blogs.msdn.microsoft.com/typescript/2018/03/27/announcing-typescript-2-8/#jsx-namespace-resolution PRs are welcome.

[JanKoehnlein]

Fixed with https://github.com/theia-ide/sprotty/commit/b64aaf041823b3da55c97b1f47dc8e5ba199dd04

As Theia now uses React as well, I had to take action. 1) I migrated the sprotty code to use local JSX factories instead. 2) With regard to the global types, the strategy is separate React JSX and snabbdom-jsx usages in distinct packages. The solution is implemented in yangster

• In the snabbdom dependent package I avoid importing the global React typings by adding an empty types property in the tsconfig.json. See https://github.com/Microsoft/TypeScript/issues/17042 for some more information.
• For the React dependent package, no action was needed as it is an upstream dependency.

[JanKoehnlein]

Two more things:

• Instead of "types": [] you could also specify "skipLibCheck": true in tsconfig.json. The downside of not checking this is that tsc will no longer check the manually defined *.d.ts files in the package.
• You can actually use React and sprotty in the same package, but it has to be separate modules.