Error when building react-native-code-push

[drplauska]

[ERROR] Expected ">" but found "{"

http-url:https://unpkg.com/react-native-code-push@latest/CodePush.js:584:30:

      584 │         return <RootComponent {...props} />
          │                               ^
          ╵                               >

[okikio]

~That should be an easy fix, I'll get on it~

[okikio]

I misspoke...this seems like an esbuild issue. I'll have to investigate

[drplauska]

thanks @okikio

[okikio]

@drplauska

1. React-Native uses a custom import syntax esbuild doens't support e.g. https://unpkg.com/react-native@0.71.3/index.js It uses import typeof ... esbuild expects import or import type ...
2. Esbuild doesn't allow JSX in .js files by default, you can enable support for it though (I think it's broken right now in bundlejs but I will enable support for it)

   { 
   esbuild: { 
   loader: { 
     ".js": "jsx" 
   } 
   } 
   }

3. I've got a partial solution that may help at least getting started, but it excludes react-native and react-native-code-push, I'll get a fix out as soon as I can but you can use this for now bundlejs result

[okikio]

@drplauska This is now fixed e.g.

https://bundlejs.com/?q=(import)code-push/script/acquisition-sdk,(import)react-native-code-push/AlertAdapter,(import)react-native-code-push/request-fetch-adapter,(import)react-native,(import)react-native-code-push/logging,(import)hoist-non-react-statics&treeshake=[{+AcquisitionManager+as+Sdk+}],[{+Alert+}],[requestFetchAdapter],[{+AppState,+Platform+}],[log],[hoistStatics]&share=...&config={"tsx":true,"esbuild":{"loader":{".js":"jsx"}},"alias":{"hermes-profile-transformer":"hermes-profile-transformer@0.0.6/dist/hermes-profile-transformer.esm.js"}}

To get this to work you need this config

{
  // You may want to enable the polyfill if you want a complete bundle that will work on the browser
  "polyfill": false,
  // JSX/TSX is no longer allowed by default to tell esbuild you can use JSX again
  // you need to change this to true
  "tsx": true,
  "esbuild": {
    "loader": {
      // Esbuild will only support JSX in `.jsx` files
      // this tells esbuild to allow JSX in `.js` files 
      ".js": "jsx",
    },
  },
  "alias": {
    // For some reason `hermes-profile-transformer` package is broken and is linking to the wrong file
    // so to fix that I direct it to the correct file
    "hermes-profile-transformer":
      "hermes-profile-transformer@0.0.6/dist/hermes-profile-transformer.esm.js",
  },
}

[okikio]

I'll mark this as done