{"componentChunkName":"component---src-templates-platform-tsx","path":"/platforms/react-native/hermes/","result":{"data":{"file":{"id":"02e256af-a2e7-52ce-9fa4-0d94a9ccbd23","relativePath":"react-native/hermes.mdx","sourceInstanceName":"platforms","childMarkdownRemark":null,"childMdx":{"body":"function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }\n\nfunction _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\n\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }\n\n/* @jsx mdx */\nvar _frontmatter = {\n  \"title\": \"Hermes\"\n};\nvar layoutProps = {\n  _frontmatter: _frontmatter\n};\nvar MDXLayout = \"wrapper\";\nreturn function MDXContent(_ref) {\n  var components = _ref.components,\n      props = _objectWithoutProperties(_ref, [\"components\"]);\n\n  return mdx(MDXLayout, _extends({}, layoutProps, props, {\n    components: components,\n    mdxType: \"MDXLayout\"\n  }), mdx(\"p\", null, \"Sentry added support for \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"react-native\"), \" builds that use the \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"hermes\"), \" engine, which required changes to the sentry SDK, \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"sentry-cli\"), \" as well as Sentry itself.\"), mdx(\"p\", null, \"Sentry customers using the SaaS product (sentry.io) will need to update the SDK, and \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"sentry-cli\"), \".\\nThe minimum required version for the SDK is \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"@sentry/react-native\"), \" \", mdx(\"a\", _extends({\n    parentName: \"p\"\n  }, {\n    \"href\": \"https://github.com/getsentry/sentry-react-native/releases/tag/1.3.3\"\n  }), \"SDK version \", mdx(\"inlineCode\", {\n    parentName: \"a\"\n  }, \"1.3.3\")), \",\\nand \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"@sentry/cli\"), \" \", mdx(\"a\", _extends({\n    parentName: \"p\"\n  }, {\n    \"href\": \"https://github.com/getsentry/sentry-cli/releases/tag/1.51.1\"\n  }), \"version \", mdx(\"inlineCode\", {\n    parentName: \"a\"\n  }, \"1.5.1\")), \".\"), mdx(\"p\", null, \"For Sentry open source, self-hosted users, the minimum version required is \", mdx(\"a\", _extends({\n    parentName: \"p\"\n  }, {\n    \"href\": \"https://hub.docker.com/r/getsentry/sentry/tags?page=1&name=f07352b\"\n  }), \"f07352b\"), \".\"), mdx(\"p\", null, \"Other than making sure you have the minimum version of the SDK, Sentry itself is all you need besides the standard integration described in the \", mdx(\"a\", _extends({\n    parentName: \"p\"\n  }, {\n    \"href\": \"/clients/react-native/\"\n  }), \"React Native Sentry documentation\"), \".\"), mdx(\"h2\", {\n    \"id\": \"custom-sourcemaps\",\n    \"style\": {\n      \"position\": \"relative\"\n    }\n  }, mdx(\"a\", _extends({\n    parentName: \"h2\"\n  }, {\n    \"href\": \"#custom-sourcemaps\",\n    \"aria-label\": \"custom sourcemaps permalink\",\n    \"className\": \"anchor before\"\n  }), mdx(\"svg\", _extends({\n    parentName: \"a\"\n  }, {\n    \"viewBox\": \"0 0 24 24\",\n    \"xmlns\": \"http://www.w3.org/2000/svg\"\n  }), mdx(\"path\", _extends({\n    parentName: \"svg\"\n  }, {\n    \"d\": \"M10.879 6.05L15 1.93A5.001 5.001 0 0 1 22.071 9l-4.121 4.121a1 1 0 0 1-1.414-1.414l4.12-4.121a3 3 0 1 0-4.242-4.243l-4.121 4.121a1 1 0 1 1-1.414-1.414zm2.242 11.9L9 22.07A5 5 0 1 1 1.929 15l4.121-4.121a1 1 0 0 1 1.414 1.414l-4.12 4.121a3 3 0 1 0 4.242 4.243l4.121-4.121a1 1 0 1 1 1.414 1.414zm-8.364-.122l13.071-13.07a1 1 0 0 1 1.415 1.414L6.172 19.242a1 1 0 1 1-1.415-1.414z\",\n    \"fill\": \"currentColor\"\n  })))), \"Custom SourceMaps\"), mdx(\"p\", null, \"The combination of \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"@sentry/react-native\"), \" and \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"@sentry/cli\"), \" should integrate\\ncorrectly into the \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"react-native\"), \" build pipeline to find and upload the correct source map.\"), mdx(\"p\", null, \"However, care must be taken to upload the correct source map when manually bundling and building React Native apps.\"), mdx(\"p\", null, \"Building Hermes bundles is a three-step process, each of which creates a different\\nsource map.\"), mdx(\"ol\", null, mdx(\"li\", {\n    parentName: \"ol\"\n  }, \"Bundling / minifying using \", mdx(\"inlineCode\", {\n    parentName: \"li\"\n  }, \"metro\"), \": \", mdx(\"inlineCode\", {\n    parentName: \"li\"\n  }, \"index.android.bundle.packager.map\")), mdx(\"li\", {\n    parentName: \"ol\"\n  }, \"Compiling to bytecode using \", mdx(\"inlineCode\", {\n    parentName: \"li\"\n  }, \"hermes\"), \": \", mdx(\"inlineCode\", {\n    parentName: \"li\"\n  }, \"index.android.bundle.compiler.map\")), mdx(\"li\", {\n    parentName: \"ol\"\n  }, \"Merging SourceMaps using \", mdx(\"inlineCode\", {\n    parentName: \"li\"\n  }, \"compose-source-maps\"), \": \", mdx(\"inlineCode\", {\n    parentName: \"li\"\n  }, \"index.android.bundle.packager.map + index.android.bundle.compiler.map => index.android.bundle.map\"))), mdx(\"p\", null, \"It is important to upload the third SourceMap (\", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"index.android.bundle.map\"), \")\\nvia \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"sentry-cli\"), \".\"));\n}\n;\nMDXContent.isMDXComponent = true;","tableOfContents":{"items":[{"url":"#custom-sourcemaps","title":"Custom SourceMaps"}]},"internal":{"type":"Mdx"}}}},"pageContext":{"excerpt":"Sentry added support for  react-native  builds that use the  hermes  engine, which required changes to the sentry SDK,  sentry-cli  as well as Sentry itself. Sentry customers using the SaaS product (sentry.io) will need to update the SDK, and  sentry-cli .\nThe minimum required version for the SDK is  @sentry/react-native   SDK version  1.3.3 ,\nand  @sentry/cli   version  1.5.1 . For Sentry open source, self-hosted users, the minimum version required is  f07352b . Other than making sure you have the minimum version of the SDK, Sentry itself is all you need besides the standard integration described in the  React Native Sentry documentation . Custom SourceMaps The combination of  @sentry/react-native  and  @sentry/cli  should integrate\ncorrectly into the  react-native  build pipeline to find and upload the correct source map. However, care must be taken to upload the correct source map when manually bundling and building React Native apps. Building Hermes bundles is a three-step process, each of which creates a different\nsource map. Bundling / minifying using  metro :  index.android.bundle.packager.map Compiling to bytecode using  hermes :  index.android.bundle.compiler.map Merging SourceMaps using  compose-source-maps :  index.android.bundle.packager.map + index.android.bundle.compiler.map => index.android.bundle.map It is important to upload the third SourceMap ( index.android.bundle.map )\nvia  sentry-cli .","title":"Hermes","platform":{"name":"react-native","title":"React Native"},"id":"02e256af-a2e7-52ce-9fa4-0d94a9ccbd23"}},"staticQueryHashes":["1218203755","1222113826","1222113826","1766336459","2158593473","2404336828","2472290386","2764967025","3818502851","4015007367","4192517163","4264099332","518019976"]}