Post purchase UI components cannot be used as a JSX component.

Post purchase UI components cannot be used as a JSX component.

Manuel_B1
Shopify Partner
1 0 1

I am getting this error in my editor TS2786: CalloutBanner cannot be used as a JSX component. this error is shown for all the components from 

@shopify/post-purchase-ui-extensions-react 

I am using the default template for post purchase ui.
I added a tsconfig.json file with this settings:

  "compilerOptions": {
"jsx": "react-jsx",
"allowSyntheticDefaultImports": true
},
"include": ["./src"]
}

but with no luck I am still getting those errors. The app runs perfectly it is just that it is showing those errors in the editor and it is so annoying. 

I also tried changing this:

render("Checkout::PostPurchase::Render", ({ extensionPoint, storage }) => (
<App extensionPoint={extensionPoint} storage={storage} />
))

 

Reply 1 (1)

craig_84labs
Shopify Partner
4 0 3

I had the same issue but was able to fix it by adding the post-purchase types to my tsconfig.json. Hope it helps!

{
  "compilerOptions": {
    "jsx": "react-jsx",
    "types": [
      "@shopify/post-purchase-ui-extensions-react"
    ]
  },
  "include": [
    "./src"
  ]
}