andycmaj / react-chat-renderer

React JSX factory implementation for Slack
15 stars 0 forks source link

Fragments hack #30

Closed andycmaj closed 4 years ago

andycmaj commented 4 years ago

added ability to use fragments.

note your project must use babel with react-jsx transformer to render fragments. Typescript's compiler can't do this yet.

so add something like this to your babel config:

  plugins: [
    [
      '@wordpress/babel-plugin-import-jsx-pragma',
      {
        scopeVariable: 'slack',
        source: 'react-chat-renderer',
        isDefault: false,
      },
    ],
    [
      '@babel/transform-react-jsx',
      {
        pragma: 'slack.h',
        pragmaFrag: 'slack.Fragment',
      },
    ],
]

and tell typescript config to preserve JSX for babel to transpile:

    "jsx": "preserve",
    "jsxFactory": "slack.h"