{"componentChunkName":"component---src-templates-doc-tsx","path":"/product/sentry-basics/guides/integrate-frontend/upload-source-maps/","result":{"data":{"file":{"id":"534092a6-4ae4-5c96-8678-dfab5b21f95e","relativePath":"product/sentry-basics/guides/integrate-frontend/upload-source-maps.mdx","sourceInstanceName":"docs","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\": \"Enable Readable Stack Traces in your Errors\",\n  \"redirect_from\": [\"/guides/integrate-frontend/upload-source-maps/\"]\n};\n\nvar makeShortcode = function makeShortcode(name) {\n  return function MDXDefaultShortcode(props) {\n    console.warn(\"Component \" + name + \" was not imported, exported, or provided by MDXProvider as global scope\");\n    return mdx(\"div\", props);\n  };\n};\n\nvar Note = makeShortcode(\"Note\");\nvar CodeTabs = makeShortcode(\"CodeTabs\");\nvar CodeBlock = makeShortcode(\"CodeBlock\");\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, \"A \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"release version\"), \" is a dynamic identifier that changes whenever you ship a new version of your code. When you give Sentry information about your releases, you unlock several features, including source mapping of minified JavaScript stack traces upon ingestion. For more information, see \", mdx(\"a\", _extends({\n    parentName: \"p\"\n  }, {\n    \"href\": \"/product/releases/\"\n  }), \"Releases\"), \".\\nIn this section, we will:\"), mdx(\"ol\", null, mdx(\"li\", {\n    parentName: \"ol\"\n  }, mdx(\"p\", {\n    parentName: \"li\"\n  }, \"Utilize the \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"Sentry CLI\"), \" \", mdx(\"strong\", {\n    parentName: \"p\"\n  }, \"during the build process\"), \" to update your Sentry account by:\"), mdx(\"ul\", {\n    parentName: \"li\"\n  }, mdx(\"li\", {\n    parentName: \"ul\"\n  }, \"Creating a new release version\"), mdx(\"li\", {\n    parentName: \"ul\"\n  }, \"Uploading the project's latest source maps (and associate them with the new release version)\"))), mdx(\"li\", {\n    parentName: \"ol\"\n  }, mdx(\"p\", {\n    parentName: \"li\"\n  }, \"Add the release version to the Sentry SDK configuration --- this will associate any error captured by the SDK in our app to this specific release. Sentry will use the release's uploaded source maps to unminify the error's stack trace.\"))), mdx(Note, {\n    mdxType: \"Note\"\n  }, mdx(\"markdown\", null, mdx(\"p\", null, \"As part of the \", mdx(\"strong\", {\n    parentName: \"p\"\n  }, \"CI/CD workflow\"), \" for this app demo, we're using a \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"Makefile\"), \" to handle the \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"sentry-cli\"), \" related tasks through \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"make\"), \" targets. If you're using a different code base, you can still apply the settings and commands described below to your specific setup or run them directly in a command-line shell as part of your build process. For more information, see \", mdx(\"a\", _extends({\n    parentName: \"p\"\n  }, {\n    \"href\": \"/product/cli/\"\n  }), \"Command Line Interface\"), \".\"))), mdx(\"h2\", {\n    \"id\": \"step-1-prepare-the-build-environment\",\n    \"style\": {\n      \"position\": \"relative\"\n    }\n  }, mdx(\"a\", _extends({\n    parentName: \"h2\"\n  }, {\n    \"href\": \"#step-1-prepare-the-build-environment\",\n    \"aria-label\": \"step 1 prepare the build environment 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  })))), \"Step 1: Prepare the build environment\"), mdx(\"p\", null, \"We use the \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"Makefile\"), \" in the \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"frontend-monitoring\"), \" project to handle Sentry related tasks utilizing the \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"sentry-cli\"), \". The CLI is already available through the project dependencies (see \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"package.json\"), \") and requires several parameters to be available to run.\"), mdx(\"ol\", null, mdx(\"li\", {\n    parentName: \"ol\"\n  }, mdx(\"p\", {\n    parentName: \"li\"\n  }, \"Open the \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"Makefile\"))), mdx(\"li\", {\n    parentName: \"ol\"\n  }, mdx(\"p\", {\n    parentName: \"li\"\n  }, \"Uncomment the commented environment variables \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"SENTRY_AUTH_TOKEN\"), \" , \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"SENTRY_ORG\"), \", and \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"SENTRY_PROJECT\"), \" (remove the leading \", mdx(\"strong\", {\n    parentName: \"p\"\n  }, \"#\"), \")\"), mdx(\"p\", {\n    parentName: \"li\"\n  }, mdx(\"span\", _extends({\n    parentName: \"p\"\n  }, {\n    \"className\": \"gatsby-resp-image-wrapper\",\n    \"style\": {\n      \"position\": \"relative\",\n      \"display\": \"block\",\n      \"marginLeft\": \"auto\",\n      \"marginRight\": \"auto\",\n      \"maxWidth\": \"1200px\"\n    }\n  }), \"\\n      \", mdx(\"a\", _extends({\n    parentName: \"span\"\n  }, {\n    \"className\": \"gatsby-resp-image-link\",\n    \"href\": \"/static/69174cd6bc735700575bc22ea8730b8f/f6a84/upload-source-maps-010.png\",\n    \"style\": {\n      \"display\": \"block\"\n    },\n    \"target\": \"_blank\",\n    \"rel\": \"noopener\"\n  }), \"\\n    \", mdx(\"span\", _extends({\n    parentName: \"a\"\n  }, {\n    \"className\": \"gatsby-resp-image-background-image\",\n    \"style\": {\n      \"paddingBottom\": \"44.99999999999999%\",\n      \"position\": \"relative\",\n      \"bottom\": \"0\",\n      \"left\": \"0\",\n      \"backgroundImage\": \"url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAJCAIAAAC9o5sfAAAACXBIWXMAAAsSAAALEgHS3X78AAABO0lEQVQoz42Q607DMAyF+x6wJrZzcdLLunbd2g3GEGXSQPADJCTe/0Vwtw7xAyGOPkWJHOscOymKctk0MYTAwTkvGGOryOvVanxax56t9YSWyMop1W+SLObbbt23dT0v5NMJJ8qyLC/zLNqqyh07sJoY0UOq0tlFiXy6v7utm1Y8pmbndKphoc0GaAW0Bl0qdEAewej0h8TZD/t+060vtj4wgwKzw3yI3Dso1FV5PZulE+nI1MwclqKm9RyNmI/+DjRgoanSNAdphqgJgMT4jNxBo9ZJ5NB3XfBeygbxDCJYpOic7JCNZWOCJSFak7kRNuQIk6LdD6+f9e657A+Lm2O5OWDeKaUloGT9g3FhVb9/ef/YP72V2yM1j2Z54PZBaRjn+03qxDRzzMJx2A27zhu0Y1qQeEqp9B/6Ar8FUVuVpZQEAAAAAElFTkSuQmCC')\",\n      \"backgroundSize\": \"cover\",\n      \"display\": \"block\"\n    }\n  })), \"\\n  \", mdx(\"img\", _extends({\n    parentName: \"a\"\n  }, {\n    \"className\": \"gatsby-resp-image-image\",\n    \"alt\": \"Initial Makefile\",\n    \"title\": \"Initial Makefile\",\n    \"src\": \"/static/69174cd6bc735700575bc22ea8730b8f/c1b63/upload-source-maps-010.png\",\n    \"srcSet\": [\"/static/69174cd6bc735700575bc22ea8730b8f/5a46d/upload-source-maps-010.png 300w\", \"/static/69174cd6bc735700575bc22ea8730b8f/0a47e/upload-source-maps-010.png 600w\", \"/static/69174cd6bc735700575bc22ea8730b8f/c1b63/upload-source-maps-010.png 1200w\", \"/static/69174cd6bc735700575bc22ea8730b8f/f6a84/upload-source-maps-010.png 1629w\"],\n    \"sizes\": \"(max-width: 1200px) 100vw, 1200px\",\n    \"style\": {\n      \"width\": \"100%\",\n      \"height\": \"100%\",\n      \"margin\": \"0\",\n      \"verticalAlign\": \"middle\",\n      \"position\": \"absolute\",\n      \"top\": \"0\",\n      \"left\": \"0\"\n    },\n    \"loading\": \"lazy\"\n  })), \"\\n  \"), \"\\n    \"))), mdx(\"li\", {\n    parentName: \"ol\"\n  }, mdx(\"p\", {\n    parentName: \"li\"\n  }, \"To find the SENTRY_ORG and SENTRY_PROJECT values\"), mdx(\"ul\", {\n    parentName: \"li\"\n  }, mdx(\"li\", {\n    parentName: \"ul\"\n  }, mdx(\"p\", {\n    parentName: \"li\"\n  }, \"Open your Sentry account and click \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"Settings > Projects\"))), mdx(\"li\", {\n    parentName: \"ul\"\n  }, mdx(\"p\", {\n    parentName: \"li\"\n  }, \"Your Organization ID is part of the browser URL (for example, \", mdx(\"a\", _extends({\n    parentName: \"p\"\n  }, {\n    \"href\": \"https://sentry.io/settings/**SENTRY_ORG**/projects/\"\n  }), \"https://sentry.io/settings/**SENTRY_ORG**/projects/\"), \")\")), mdx(\"li\", {\n    parentName: \"ul\"\n  }, mdx(\"p\", {\n    parentName: \"li\"\n  }, \"The SENTRY_PROJECT value is the name that appears in the project tile\"), mdx(\"p\", {\n    parentName: \"li\"\n  }, mdx(\"span\", _extends({\n    parentName: \"p\"\n  }, {\n    \"className\": \"gatsby-resp-image-wrapper\",\n    \"style\": {\n      \"position\": \"relative\",\n      \"display\": \"block\",\n      \"marginLeft\": \"auto\",\n      \"marginRight\": \"auto\",\n      \"maxWidth\": \"1200px\"\n    }\n  }), \"\\n      \", mdx(\"a\", _extends({\n    parentName: \"span\"\n  }, {\n    \"className\": \"gatsby-resp-image-link\",\n    \"href\": \"/static/57d53b597954ae1d49159f534ecd52f1/1e093/upload-source-maps-011.png\",\n    \"style\": {\n      \"display\": \"block\"\n    },\n    \"target\": \"_blank\",\n    \"rel\": \"noopener\"\n  }), \"\\n    \", mdx(\"span\", _extends({\n    parentName: \"a\"\n  }, {\n    \"className\": \"gatsby-resp-image-background-image\",\n    \"style\": {\n      \"paddingBottom\": \"64.66666666666666%\",\n      \"position\": \"relative\",\n      \"bottom\": \"0\",\n      \"left\": \"0\",\n      \"backgroundImage\": \"url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAANCAIAAAAmMtkJAAAACXBIWXMAAAsSAAALEgHS3X78AAACEUlEQVQoz42SS28SQRzA91N4qo0mBcqzNVLBICzgwspiX6LhZNTEqybqoQcvxk/gVzLReDLV+LiIqVooMPuE3Z3n7qwDRGKa2Dj5ZTKZ5Df/10gQ+tBHPkQnQO8d/eqPAdDtD8bnN+a7Q/PTAADLdT1KpghZrgcsmzAWRRGPZkt6+uDVs/svDx6+eHLv+eO7B4ZuQ4hcDxuW70GIMRWb60E+F5aEIYeISO38o0a620jvFVcVeV3TdSsIQ4jodEoRwghTygKESRDyP4QCFgTiUUnb7KiZTi2xvbVSU3K7lu5gRKGHF4kJeTQyTXNCWHgKGnCptdFVc3eq6zO5nt3pDY/67snAHeIQz2TCbMebTCChoQDTYAESECY1UreU9H49vVtYrcuJ1sfjL98m349x/6c/tLHPGNdtZ2xaU4w8gpfyAknN3VYye5W4lr9YUwr7+tjwCaaMTTC0ic+D6AfsvwWHrwfvv3o9kUvI+RKpme3U0zuVmFbMqE21C4YGY+KeL+YhahMZ+5j4hELCTkeW4zfLcU1Oalvn5dJaAwATE9HLkM+DiOOiNzMYP9UzSU60y4lWJdnaXCldS6k6MMUAMaHRX/K/kKqx7UqsVbxwPXuuWEo2wdiculDM8L9k+apWLt64cqmaWsuXkg3xw0TNIrj4hvOaz5RLbaVcbxYq1fjljVKmORoajuMahsPmZZ8t/wbC129e9pW63QAAAABJRU5ErkJggg==')\",\n      \"backgroundSize\": \"cover\",\n      \"display\": \"block\"\n    }\n  })), \"\\n  \", mdx(\"img\", _extends({\n    parentName: \"a\"\n  }, {\n    \"className\": \"gatsby-resp-image-image\",\n    \"alt\": \"Sentry CLI variables\",\n    \"title\": \"Sentry CLI variables\",\n    \"src\": \"/static/57d53b597954ae1d49159f534ecd52f1/c1b63/upload-source-maps-011.png\",\n    \"srcSet\": [\"/static/57d53b597954ae1d49159f534ecd52f1/5a46d/upload-source-maps-011.png 300w\", \"/static/57d53b597954ae1d49159f534ecd52f1/0a47e/upload-source-maps-011.png 600w\", \"/static/57d53b597954ae1d49159f534ecd52f1/c1b63/upload-source-maps-011.png 1200w\", \"/static/57d53b597954ae1d49159f534ecd52f1/1e093/upload-source-maps-011.png 1376w\"],\n    \"sizes\": \"(max-width: 1200px) 100vw, 1200px\",\n    \"style\": {\n      \"width\": \"100%\",\n      \"height\": \"100%\",\n      \"margin\": \"0\",\n      \"verticalAlign\": \"middle\",\n      \"position\": \"absolute\",\n      \"top\": \"0\",\n      \"left\": \"0\"\n    },\n    \"loading\": \"lazy\"\n  })), \"\\n  \"), \"\\n    \"))), mdx(\"li\", {\n    parentName: \"ul\"\n  }, mdx(\"p\", {\n    parentName: \"li\"\n  }, \"Copy the values and paste them in the Makefile\")))), mdx(\"li\", {\n    parentName: \"ol\"\n  }, mdx(\"p\", {\n    parentName: \"li\"\n  }, \"To create a \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"SENTRY_AUTH_TOKEN\")), mdx(\"ul\", {\n    parentName: \"li\"\n  }, mdx(\"li\", {\n    parentName: \"ul\"\n  }, mdx(\"p\", {\n    parentName: \"li\"\n  }, \"Click on the \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"Developer Settings\"), \" menu option name from the left side panel to create a new integration and org-level auth token\")), mdx(\"li\", {\n    parentName: \"ul\"\n  }, mdx(\"p\", {\n    parentName: \"li\"\n  }, \"Click on \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"New Internal Integration\")), mdx(\"p\", {\n    parentName: \"li\"\n  }, mdx(\"span\", _extends({\n    parentName: \"p\"\n  }, {\n    \"className\": \"gatsby-resp-image-wrapper\",\n    \"style\": {\n      \"position\": \"relative\",\n      \"display\": \"block\",\n      \"marginLeft\": \"auto\",\n      \"marginRight\": \"auto\",\n      \"maxWidth\": \"1200px\"\n    }\n  }), \"\\n      \", mdx(\"a\", _extends({\n    parentName: \"span\"\n  }, {\n    \"className\": \"gatsby-resp-image-link\",\n    \"href\": \"/static/4654b9992fd9266e45b07fea72c89767/6052f/upload-source-maps-04.png\",\n    \"style\": {\n      \"display\": \"block\"\n    },\n    \"target\": \"_blank\",\n    \"rel\": \"noopener\"\n  }), \"\\n    \", mdx(\"span\", _extends({\n    parentName: \"a\"\n  }, {\n    \"className\": \"gatsby-resp-image-background-image\",\n    \"style\": {\n      \"paddingBottom\": \"40.33333333333333%\",\n      \"position\": \"relative\",\n      \"bottom\": \"0\",\n      \"left\": \"0\",\n      \"backgroundImage\": \"url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAICAIAAAB2/0i6AAAACXBIWXMAAAsSAAALEgHS3X78AAABfElEQVQY012RR0sDQRiG9y8oehbBgiU2PEiCETVRjGK9ePIf+KNEULFgAcWriKLoxYPlYAFlg2Cys7szO734rQFBh2eG9zDvV7357OpSbmWkbfpo+9Q5FwQUY8q5JAkjCVfaaGt/kcokVEhtanil/uVC53ymIXu0k5qFEMa6KE4QwgGKEyaUcVLbn9+2JrjQKVJ7k92LxcxCb2PuYOsEzJhSrnWSxGFYAaK4GuMAY0RwCC8mIWURpACM4d5EZjHfWuptGj7cSzMjSkJOGWNBgMIo4oIxnsIFXCYVRyG5uS5fXfhPjxVvrHNurGu2r2l4f+cYzGmTxkKtSltAG/cH66Q0nz7zP2i1Irx8SynfPtVRN3iwmZq10jAYxiV0C3CphNI1QEPccoQuH16uHl/vP3xvNDOT7Si21Q+sbWx+2eo78YmFqmWME0woeH5nC9o45yN0dvN6fvt29+x7uUJxaHy0pblnY3030FE5/mTpRpx2KcrYfxhYxs+xxn0D/r2Rpm1xRs0AAAAASUVORK5CYII=')\",\n      \"backgroundSize\": \"cover\",\n      \"display\": \"block\"\n    }\n  })), \"\\n  \", mdx(\"img\", _extends({\n    parentName: \"a\"\n  }, {\n    \"className\": \"gatsby-resp-image-image\",\n    \"alt\": \"Create Auth Token 1\",\n    \"title\": \"Create Auth Token 1\",\n    \"src\": \"/static/4654b9992fd9266e45b07fea72c89767/c1b63/upload-source-maps-04.png\",\n    \"srcSet\": [\"/static/4654b9992fd9266e45b07fea72c89767/5a46d/upload-source-maps-04.png 300w\", \"/static/4654b9992fd9266e45b07fea72c89767/0a47e/upload-source-maps-04.png 600w\", \"/static/4654b9992fd9266e45b07fea72c89767/c1b63/upload-source-maps-04.png 1200w\", \"/static/4654b9992fd9266e45b07fea72c89767/d61c2/upload-source-maps-04.png 1800w\", \"/static/4654b9992fd9266e45b07fea72c89767/6052f/upload-source-maps-04.png 2030w\"],\n    \"sizes\": \"(max-width: 1200px) 100vw, 1200px\",\n    \"style\": {\n      \"width\": \"100%\",\n      \"height\": \"100%\",\n      \"margin\": \"0\",\n      \"verticalAlign\": \"middle\",\n      \"position\": \"absolute\",\n      \"top\": \"0\",\n      \"left\": \"0\"\n    },\n    \"loading\": \"lazy\"\n  })), \"\\n  \"), \"\\n    \"))), mdx(\"li\", {\n    parentName: \"ul\"\n  }, mdx(\"p\", {\n    parentName: \"li\"\n  }, \"Enter a \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"Name\"))), mdx(\"li\", {\n    parentName: \"ul\"\n  }, mdx(\"p\", {\n    parentName: \"li\"\n  }, \"Under \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"Permissions\"), \" set \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"Release:Admin\"), \" and \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"Organization:Read & Write\")), mdx(\"p\", {\n    parentName: \"li\"\n  }, mdx(\"span\", _extends({\n    parentName: \"p\"\n  }, {\n    \"className\": \"gatsby-resp-image-wrapper\",\n    \"style\": {\n      \"position\": \"relative\",\n      \"display\": \"block\",\n      \"marginLeft\": \"auto\",\n      \"marginRight\": \"auto\",\n      \"maxWidth\": \"1200px\"\n    }\n  }), \"\\n      \", mdx(\"a\", _extends({\n    parentName: \"span\"\n  }, {\n    \"className\": \"gatsby-resp-image-link\",\n    \"href\": \"/static/b639f3c7b2715d9185616c53a492c66e/6052f/upload-source-maps-016.png\",\n    \"style\": {\n      \"display\": \"block\"\n    },\n    \"target\": \"_blank\",\n    \"rel\": \"noopener\"\n  }), \"\\n    \", mdx(\"span\", _extends({\n    parentName: \"a\"\n  }, {\n    \"className\": \"gatsby-resp-image-background-image\",\n    \"style\": {\n      \"paddingBottom\": \"46.666666666666664%\",\n      \"position\": \"relative\",\n      \"bottom\": \"0\",\n      \"left\": \"0\",\n      \"backgroundImage\": \"url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAJCAIAAAC9o5sfAAAACXBIWXMAAAsSAAALEgHS3X78AAAA7klEQVQoz22RiY7DIAxE8/+/md00TdKcGAw+WJOuUBpVeljIMBoPNPPhntPiEwViwzZXvjYrzQF+311MhDEhJhLRnCsB0YFnkRvETCwN2LlJmd9dUb2KY0zeo3XvsPyLfUD+NKysYZ9hDRL8JyA+MjXbAfOypURmYgO8NVJKpswt/nbU9zo+ZKj0MrbSOfYN+LCsO0AIWDJXT7GqOWICQP0ytpaxXRFvZ2yxRWcYg+1G1j6NbeieMg36uvLQAQRLZufAtKa0WqEzwhCmn71bZF11u/KS2XMsX7XZVxGbOau55Yo9fIqEIZU34Ds23R8XyQ2AtaF8EAAAAABJRU5ErkJggg==')\",\n      \"backgroundSize\": \"cover\",\n      \"display\": \"block\"\n    }\n  })), \"\\n  \", mdx(\"img\", _extends({\n    parentName: \"a\"\n  }, {\n    \"className\": \"gatsby-resp-image-image\",\n    \"alt\": \"Token Permissions\",\n    \"title\": \"Token Permissions\",\n    \"src\": \"/static/b639f3c7b2715d9185616c53a492c66e/c1b63/upload-source-maps-016.png\",\n    \"srcSet\": [\"/static/b639f3c7b2715d9185616c53a492c66e/5a46d/upload-source-maps-016.png 300w\", \"/static/b639f3c7b2715d9185616c53a492c66e/0a47e/upload-source-maps-016.png 600w\", \"/static/b639f3c7b2715d9185616c53a492c66e/c1b63/upload-source-maps-016.png 1200w\", \"/static/b639f3c7b2715d9185616c53a492c66e/d61c2/upload-source-maps-016.png 1800w\", \"/static/b639f3c7b2715d9185616c53a492c66e/6052f/upload-source-maps-016.png 2030w\"],\n    \"sizes\": \"(max-width: 1200px) 100vw, 1200px\",\n    \"style\": {\n      \"width\": \"100%\",\n      \"height\": \"100%\",\n      \"margin\": \"0\",\n      \"verticalAlign\": \"middle\",\n      \"position\": \"absolute\",\n      \"top\": \"0\",\n      \"left\": \"0\"\n    },\n    \"loading\": \"lazy\"\n  })), \"\\n  \"), \"\\n    \"))), mdx(\"li\", {\n    parentName: \"ul\"\n  }, mdx(\"p\", {\n    parentName: \"li\"\n  }, \"Click on \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"Save Changes\"))), mdx(\"li\", {\n    parentName: \"ul\"\n  }, mdx(\"p\", {\n    parentName: \"li\"\n  }, \"Once the save is successfully confirmed, scroll down to the bottom of the page and copy the allocated token under \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"TOKENS\")), mdx(\"p\", {\n    parentName: \"li\"\n  }, mdx(\"span\", _extends({\n    parentName: \"p\"\n  }, {\n    \"className\": \"gatsby-resp-image-wrapper\",\n    \"style\": {\n      \"position\": \"relative\",\n      \"display\": \"block\",\n      \"marginLeft\": \"auto\",\n      \"marginRight\": \"auto\",\n      \"maxWidth\": \"1200px\"\n    }\n  }), \"\\n      \", mdx(\"a\", _extends({\n    parentName: \"span\"\n  }, {\n    \"className\": \"gatsby-resp-image-link\",\n    \"href\": \"/static/01fc1735680b4f035032e4240ed14397/e4611/upload-source-maps-05.png\",\n    \"style\": {\n      \"display\": \"block\"\n    },\n    \"target\": \"_blank\",\n    \"rel\": \"noopener\"\n  }), \"\\n    \", mdx(\"span\", _extends({\n    parentName: \"a\"\n  }, {\n    \"className\": \"gatsby-resp-image-background-image\",\n    \"style\": {\n      \"paddingBottom\": \"46%\",\n      \"position\": \"relative\",\n      \"bottom\": \"0\",\n      \"left\": \"0\",\n      \"backgroundImage\": \"url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAJCAIAAAC9o5sfAAAACXBIWXMAAAsSAAALEgHS3X78AAABI0lEQVQoz32Ry07DMBBF/f9fgFghvoENEixgyaKlO1ggxKOJk+bh+O0Zx2GctAhaqdZZjO07vr42U4PtWgEQAcaZeESEhCEFiCFkSCOEqnhjtGfGONFLKbWSZmZfLCtGug/1VRhulHXWOechAGkGIb0D5qxvdl3Fd7ysF6jeT3nd8HbdbtbVc1O15CB6QUf0naBmBGTWBq0dHRMxEYjjQsQRkMYYEL0HCDGvU658eYQ5BVPS7upuEDp4PIJ6SEcNePoWIQvI2Q1ikFKllKaTobXZfnNe5DhlUVFRbHlNEQYV48hmh0AmNDkleLDG/0IvDABpwpQieTGqMUdNh6/6x7J1EOTLvb/Jh7vy8b7crFr2d/s82XKaVk/11cXL9eXr7c3nD8EEBJSnwgFwAAAAAElFTkSuQmCC')\",\n      \"backgroundSize\": \"cover\",\n      \"display\": \"block\"\n    }\n  })), \"\\n  \", mdx(\"img\", _extends({\n    parentName: \"a\"\n  }, {\n    \"className\": \"gatsby-resp-image-image\",\n    \"alt\": \"Create Auth Token 2\",\n    \"title\": \"Create Auth Token 2\",\n    \"src\": \"/static/01fc1735680b4f035032e4240ed14397/c1b63/upload-source-maps-05.png\",\n    \"srcSet\": [\"/static/01fc1735680b4f035032e4240ed14397/5a46d/upload-source-maps-05.png 300w\", \"/static/01fc1735680b4f035032e4240ed14397/0a47e/upload-source-maps-05.png 600w\", \"/static/01fc1735680b4f035032e4240ed14397/c1b63/upload-source-maps-05.png 1200w\", \"/static/01fc1735680b4f035032e4240ed14397/e4611/upload-source-maps-05.png 1298w\"],\n    \"sizes\": \"(max-width: 1200px) 100vw, 1200px\",\n    \"style\": {\n      \"width\": \"100%\",\n      \"height\": \"100%\",\n      \"margin\": \"0\",\n      \"verticalAlign\": \"middle\",\n      \"position\": \"absolute\",\n      \"top\": \"0\",\n      \"left\": \"0\"\n    },\n    \"loading\": \"lazy\"\n  })), \"\\n  \"), \"\\n    \"))), mdx(\"li\", {\n    parentName: \"ul\"\n  }, mdx(\"p\", {\n    parentName: \"li\"\n  }, \"Paste the token in the Makefile\")))), mdx(\"li\", {\n    parentName: \"ol\"\n  }, mdx(\"p\", {\n    parentName: \"li\"\n  }, \"The Makefile should look like this:\"), mdx(\"p\", {\n    parentName: \"li\"\n  }, mdx(\"span\", _extends({\n    parentName: \"p\"\n  }, {\n    \"className\": \"gatsby-resp-image-wrapper\",\n    \"style\": {\n      \"position\": \"relative\",\n      \"display\": \"block\",\n      \"marginLeft\": \"auto\",\n      \"marginRight\": \"auto\",\n      \"maxWidth\": \"1200px\"\n    }\n  }), \"\\n      \", mdx(\"a\", _extends({\n    parentName: \"span\"\n  }, {\n    \"className\": \"gatsby-resp-image-link\",\n    \"href\": \"/static/1b9aab1751ffe818074d2ead5858d164/37048/upload-source-maps-012.png\",\n    \"style\": {\n      \"display\": \"block\"\n    },\n    \"target\": \"_blank\",\n    \"rel\": \"noopener\"\n  }), \"\\n    \", mdx(\"span\", _extends({\n    parentName: \"a\"\n  }, {\n    \"className\": \"gatsby-resp-image-background-image\",\n    \"style\": {\n      \"paddingBottom\": \"31.666666666666664%\",\n      \"position\": \"relative\",\n      \"bottom\": \"0\",\n      \"left\": \"0\",\n      \"backgroundImage\": \"url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAGCAIAAABM9SnKAAAACXBIWXMAAAsSAAALEgHS3X78AAAAzUlEQVQY03WQwW7DIAxA+Y0EEmxsQwIkrFHadWp3mLTt1v//nVk7TOshT8/Gkm2QMCml1tp6WtvWTkXOl22aJwg+MCKp4P14hNFAhDCNnD2mMWTPhSRTXDk2oRT8MQYAJS/L9V4vby/X27Kfre27rrOud87Z3h6hXQOIqW3712P/fLx+fN/u721da60e4HfAWTe4P4cnjL5OSkANYj1BmOcokYIEVCNpDqw1IcDTBxhEZKZSUimTOieZEmemLFSj1MhLEnUWLlFvgOHf8g+tVDGkh2NtDQAAAABJRU5ErkJggg==')\",\n      \"backgroundSize\": \"cover\",\n      \"display\": \"block\"\n    }\n  })), \"\\n  \", mdx(\"img\", _extends({\n    parentName: \"a\"\n  }, {\n    \"className\": \"gatsby-resp-image-image\",\n    \"alt\": \"Sentry CLI variables\",\n    \"title\": \"Sentry CLI variables\",\n    \"src\": \"/static/1b9aab1751ffe818074d2ead5858d164/c1b63/upload-source-maps-012.png\",\n    \"srcSet\": [\"/static/1b9aab1751ffe818074d2ead5858d164/5a46d/upload-source-maps-012.png 300w\", \"/static/1b9aab1751ffe818074d2ead5858d164/0a47e/upload-source-maps-012.png 600w\", \"/static/1b9aab1751ffe818074d2ead5858d164/c1b63/upload-source-maps-012.png 1200w\", \"/static/1b9aab1751ffe818074d2ead5858d164/37048/upload-source-maps-012.png 1352w\"],\n    \"sizes\": \"(max-width: 1200px) 100vw, 1200px\",\n    \"style\": {\n      \"width\": \"100%\",\n      \"height\": \"100%\",\n      \"margin\": \"0\",\n      \"verticalAlign\": \"middle\",\n      \"position\": \"absolute\",\n      \"top\": \"0\",\n      \"left\": \"0\"\n    },\n    \"loading\": \"lazy\"\n  })), \"\\n  \"), \"\\n    \")))), mdx(\"h2\", {\n    \"id\": \"step-2-create-a-release-and-upload-source-maps\",\n    \"style\": {\n      \"position\": \"relative\"\n    }\n  }, mdx(\"a\", _extends({\n    parentName: \"h2\"\n  }, {\n    \"href\": \"#step-2-create-a-release-and-upload-source-maps\",\n    \"aria-label\": \"step 2 create a release and upload source maps 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  })))), \"Step 2: Create a release and upload source maps\"), mdx(\"p\", null, \"Now we can invoke the \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"sentry-cli\"), \" to let Sentry know we have a new release and upload the project's source maps to it.\"), mdx(\"ul\", null, mdx(\"li\", {\n    parentName: \"ul\"\n  }, \"You can set a custom release version to suit your naming conventions or let the Sentry CLI propose a version.\"), mdx(\"li\", {\n    parentName: \"ul\"\n  }, \"To build the \", mdx(\"inlineCode\", {\n    parentName: \"li\"\n  }, \"frontend-monitoring\"), \" project, we use the \", mdx(\"inlineCode\", {\n    parentName: \"li\"\n  }, \"react-scripts\"), \" package that also generates source maps under \", mdx(\"em\", {\n    parentName: \"li\"\n  }, \"./build/static/js/\"))), mdx(\"ol\", null, mdx(\"li\", {\n    parentName: \"ol\"\n  }, mdx(\"p\", {\n    parentName: \"li\"\n  }, \"In the Makefile, add a new environment variable for the release version, utilizing Sentry CLI to propose the version value\"), mdx(\"div\", _extends({\n    parentName: \"li\"\n  }, {\n    \"className\": \"code-tabs-wrapper\"\n  }), mdx(CodeTabs, {\n    mdxType: \"CodeTabs\"\n  }, mdx(CodeBlock, {\n    language: \"bash\",\n    title: \"\",\n    filename: \"\",\n    mdxType: \"CodeBlock\"\n  }, mdx(\"div\", _extends({\n    parentName: \"div\"\n  }, {\n    \"className\": \"gatsby-highlight\",\n    \"data-language\": \"bash\"\n  }), mdx(\"pre\", _extends({\n    parentName: \"div\"\n  }, {\n    \"className\": \"language-bash\"\n  }), mdx(\"code\", _extends({\n    parentName: \"pre\"\n  }, {\n    \"className\": \"language-bash\"\n  }), mdx(\"span\", _extends({\n    parentName: \"code\"\n  }, {\n    \"className\": \"token assign-left variable\"\n  }), \"REACT_APP_RELEASE_VERSION\"), mdx(\"span\", _extends({\n    parentName: \"code\"\n  }, {\n    \"className\": \"token operator\"\n  }), \"=\"), mdx(\"span\", _extends({\n    parentName: \"code\"\n  }, {\n    \"className\": \"token variable\"\n  }), mdx(\"span\", _extends({\n    parentName: \"span\"\n  }, {\n    \"className\": \"token variable\"\n  }), \"`\"), \"sentry-cli releases propose-version\", mdx(\"span\", _extends({\n    parentName: \"span\"\n  }, {\n    \"className\": \"token variable\"\n  }), \"`\"))))))))), mdx(\"li\", {\n    parentName: \"ol\"\n  }, mdx(\"p\", {\n    parentName: \"li\"\n  }, \"At the bottom of the Makefile, paste the following targets utilizing the Sentry CLI to:\"), mdx(\"ul\", {\n    parentName: \"li\"\n  }, mdx(\"li\", {\n    parentName: \"ul\"\n  }, \"Create a new release entity in your Sentry account\"), mdx(\"li\", {\n    parentName: \"ul\"\n  }, \"Upload the project's source maps to the new release\")), mdx(\"div\", _extends({\n    parentName: \"li\"\n  }, {\n    \"className\": \"code-tabs-wrapper\"\n  }), mdx(CodeTabs, {\n    mdxType: \"CodeTabs\"\n  }, mdx(CodeBlock, {\n    language: \"bash\",\n    title: \"\",\n    filename: \"\",\n    mdxType: \"CodeBlock\"\n  }, mdx(\"div\", _extends({\n    parentName: \"div\"\n  }, {\n    \"className\": \"gatsby-highlight\",\n    \"data-language\": \"bash\"\n  }), mdx(\"pre\", _extends({\n    parentName: \"div\"\n  }, {\n    \"className\": \"language-bash\"\n  }), mdx(\"code\", _extends({\n    parentName: \"pre\"\n  }, {\n    \"className\": \"language-bash\"\n  }), \"create_release:\\n    sentry-cli releases -o \", mdx(\"span\", _extends({\n    parentName: \"code\"\n  }, {\n    \"className\": \"token variable\"\n  }), mdx(\"span\", _extends({\n    parentName: \"span\"\n  }, {\n    \"className\": \"token variable\"\n  }), \"$(\"), \"SENTRY_ORG\", mdx(\"span\", _extends({\n    parentName: \"span\"\n  }, {\n    \"className\": \"token variable\"\n  }), \")\")), \" new -p \", mdx(\"span\", _extends({\n    parentName: \"code\"\n  }, {\n    \"className\": \"token variable\"\n  }), mdx(\"span\", _extends({\n    parentName: \"span\"\n  }, {\n    \"className\": \"token variable\"\n  }), \"$(\"), \"SENTRY_PROJECT\", mdx(\"span\", _extends({\n    parentName: \"span\"\n  }, {\n    \"className\": \"token variable\"\n  }), \")\")), \" \", mdx(\"span\", _extends({\n    parentName: \"code\"\n  }, {\n    \"className\": \"token variable\"\n  }), mdx(\"span\", _extends({\n    parentName: \"span\"\n  }, {\n    \"className\": \"token variable\"\n  }), \"$(\"), \"REACT_APP_RELEASE_VERSION\", mdx(\"span\", _extends({\n    parentName: \"span\"\n  }, {\n    \"className\": \"token variable\"\n  }), \")\")), \"\\n\\nupload_sourcemaps:\\n    sentry-cli releases -o \", mdx(\"span\", _extends({\n    parentName: \"code\"\n  }, {\n    \"className\": \"token variable\"\n  }), mdx(\"span\", _extends({\n    parentName: \"span\"\n  }, {\n    \"className\": \"token variable\"\n  }), \"$(\"), \"SENTRY_ORG\", mdx(\"span\", _extends({\n    parentName: \"span\"\n  }, {\n    \"className\": \"token variable\"\n  }), \")\")), \" -p \", mdx(\"span\", _extends({\n    parentName: \"code\"\n  }, {\n    \"className\": \"token variable\"\n  }), mdx(\"span\", _extends({\n    parentName: \"span\"\n  }, {\n    \"className\": \"token variable\"\n  }), \"$(\"), \"SENTRY_PROJECT\", mdx(\"span\", _extends({\n    parentName: \"span\"\n  }, {\n    \"className\": \"token variable\"\n  }), \")\")), \" files \", mdx(\"span\", _extends({\n    parentName: \"code\"\n  }, {\n    \"className\": \"token variable\"\n  }), mdx(\"span\", _extends({\n    parentName: \"span\"\n  }, {\n    \"className\": \"token variable\"\n  }), \"$(\"), \"REACT_APP_RELEASE_VERSION\", mdx(\"span\", _extends({\n    parentName: \"span\"\n  }, {\n    \"className\": \"token variable\"\n  }), \")\")), \" \", mdx(\"span\", _extends({\n    parentName: \"code\"\n  }, {\n    \"className\": \"token punctuation\"\n  }), \"\\\\\"), \"\\n        upload-sourcemaps --url-prefix \", mdx(\"span\", _extends({\n    parentName: \"code\"\n  }, {\n    \"className\": \"token string\"\n  }), \"\\\"~/static/js\\\"\"), \" --validate build/static/js\")))))), mdx(\"p\", {\n    parentName: \"li\"\n  }, \"The Makefile contains a \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"setup_release\"), \" target that is invoked from the \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"package.json\"), \" file when running \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"$ npm run deploy\"), \" to build and run the project. We'll use this target to invoke all the release related tasks.\")), mdx(\"li\", {\n    parentName: \"ol\"\n  }, mdx(\"p\", {\n    parentName: \"li\"\n  }, \"Replace the existing \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"setup_release\"), \" with:\"), mdx(\"div\", _extends({\n    parentName: \"li\"\n  }, {\n    \"className\": \"code-tabs-wrapper\"\n  }), mdx(CodeTabs, {\n    mdxType: \"CodeTabs\"\n  }, mdx(CodeBlock, {\n    language: \"Shell\",\n    title: \"\",\n    filename: \"\",\n    mdxType: \"CodeBlock\"\n  }, mdx(\"div\", _extends({\n    parentName: \"div\"\n  }, {\n    \"className\": \"gatsby-highlight\",\n    \"data-language\": \"shell\"\n  }), mdx(\"pre\", _extends({\n    parentName: \"div\"\n  }, {\n    \"className\": \"language-shell\"\n  }), mdx(\"code\", _extends({\n    parentName: \"pre\"\n  }, {\n    \"className\": \"language-shell\"\n  }), \"setup_release: create_release upload_sourcemaps\")))))), mdx(\"p\", {\n    parentName: \"li\"\n  }, \"Your Makefile should look like this:\"), mdx(\"p\", {\n    parentName: \"li\"\n  }, mdx(\"span\", _extends({\n    parentName: \"p\"\n  }, {\n    \"className\": \"gatsby-resp-image-wrapper\",\n    \"style\": {\n      \"position\": \"relative\",\n      \"display\": \"block\",\n      \"marginLeft\": \"auto\",\n      \"marginRight\": \"auto\",\n      \"maxWidth\": \"1200px\"\n    }\n  }), \"\\n      \", mdx(\"a\", _extends({\n    parentName: \"span\"\n  }, {\n    \"className\": \"gatsby-resp-image-link\",\n    \"href\": \"/static/b771f5baae35f40840702672da5adb5b/7f15f/upload-source-maps-03.png\",\n    \"style\": {\n      \"display\": \"block\"\n    },\n    \"target\": \"_blank\",\n    \"rel\": \"noopener\"\n  }), \"\\n    \", mdx(\"span\", _extends({\n    parentName: \"a\"\n  }, {\n    \"className\": \"gatsby-resp-image-background-image\",\n    \"style\": {\n      \"paddingBottom\": \"49.33333333333333%\",\n      \"position\": \"relative\",\n      \"bottom\": \"0\",\n      \"left\": \"0\",\n      \"backgroundImage\": \"url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAKCAIAAAA7N+mxAAAACXBIWXMAAAsSAAALEgHS3X78AAABQ0lEQVQoz41Q207DMAztf6xrm8SOnXuyZh0DiYfxyP//D27hCQFCOjpyKp+LO2hSJmrllI7aBMCEWCxknI06T/PfGKhe/fUe+i3127yocZqFp3n5D4b08mhv7+vr4+n+nFNm9uN5+oZfk43PmBqWVZgvW0iF2Vli54MPMaYsvCj9o8WgEZEJicEykENLohQWuTYgMoE0PAumg7/mQwwIkmTZIu4y2h/0mbwodTqdxvG8lx+PE2Q+8CWWzdqKQNK0NkobOURZp5QGtBgLhAyWgINxEXwWxliljhgMssxOjpTmJNsaQJFTuM/GgLgsAjFFWpA0eU3OsJ+O5oPzvPa23fraL9JWwHVFnyxaLs2mZkPaj/HRpgo+7YgVXNiTxUAE/bq1y3rdbvJva99CrrmUsnaOpfWt1NrWLt+tiwuQsqwMivADjgNXdNs5RxgAAAAASUVORK5CYII=')\",\n      \"backgroundSize\": \"cover\",\n      \"display\": \"block\"\n    }\n  })), \"\\n  \", mdx(\"img\", _extends({\n    parentName: \"a\"\n  }, {\n    \"className\": \"gatsby-resp-image-image\",\n    \"alt\": \"Makefile with Release\",\n    \"title\": \"Makefile with Release\",\n    \"src\": \"/static/b771f5baae35f40840702672da5adb5b/c1b63/upload-source-maps-03.png\",\n    \"srcSet\": [\"/static/b771f5baae35f40840702672da5adb5b/5a46d/upload-source-maps-03.png 300w\", \"/static/b771f5baae35f40840702672da5adb5b/0a47e/upload-source-maps-03.png 600w\", \"/static/b771f5baae35f40840702672da5adb5b/c1b63/upload-source-maps-03.png 1200w\", \"/static/b771f5baae35f40840702672da5adb5b/7f15f/upload-source-maps-03.png 1530w\"],\n    \"sizes\": \"(max-width: 1200px) 100vw, 1200px\",\n    \"style\": {\n      \"width\": \"100%\",\n      \"height\": \"100%\",\n      \"margin\": \"0\",\n      \"verticalAlign\": \"middle\",\n      \"position\": \"absolute\",\n      \"top\": \"0\",\n      \"left\": \"0\"\n    },\n    \"loading\": \"lazy\"\n  })), \"\\n  \"), \"\\n    \")), mdx(\"p\", {\n    parentName: \"li\"\n  }, \"Now that you created a release version, you can associate any errors captured in your app to that release through the SDK.\")), mdx(\"li\", {\n    parentName: \"ol\"\n  }, mdx(\"p\", {\n    parentName: \"li\"\n  }, \"Open the \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"index.html\"), \" file and add a new configuration option to the SDK.\"), mdx(\"p\", {\n    parentName: \"li\"\n  }, \"Assign the release version environment variable to the \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"release\"), \" key\"), mdx(\"div\", _extends({\n    parentName: \"li\"\n  }, {\n    \"className\": \"code-tabs-wrapper\"\n  }), mdx(CodeTabs, {\n    mdxType: \"CodeTabs\"\n  }, mdx(CodeBlock, {\n    language: \"javascript\",\n    title: \"\",\n    filename: \"\",\n    mdxType: \"CodeBlock\"\n  }, mdx(\"div\", _extends({\n    parentName: \"div\"\n  }, {\n    \"className\": \"gatsby-highlight\",\n    \"data-language\": \"javascript\"\n  }), mdx(\"pre\", _extends({\n    parentName: \"div\"\n  }, {\n    \"className\": \"language-javascript\"\n  }), mdx(\"code\", _extends({\n    parentName: \"pre\"\n  }, {\n    \"className\": \"language-javascript\"\n  }), \"Sentry\", mdx(\"span\", _extends({\n    parentName: \"code\"\n  }, {\n    \"className\": \"token punctuation\"\n  }), \".\"), mdx(\"span\", _extends({\n    parentName: \"code\"\n  }, {\n    \"className\": \"token function\"\n  }), \"init\"), mdx(\"span\", _extends({\n    parentName: \"code\"\n  }, {\n    \"className\": \"token punctuation\"\n  }), \"(\"), mdx(\"span\", _extends({\n    parentName: \"code\"\n  }, {\n    \"className\": \"token punctuation\"\n  }), \"{\"), \"\\n  dsn\", mdx(\"span\", _extends({\n    parentName: \"code\"\n  }, {\n    \"className\": \"token operator\"\n  }), \":\"), \" \", mdx(\"span\", _extends({\n    parentName: \"code\"\n  }, {\n    \"className\": \"token string\"\n  }), \"\\\"<YOUR DSN KEY>\\\"\"), mdx(\"span\", _extends({\n    parentName: \"code\"\n  }, {\n    \"className\": \"token punctuation\"\n  }), \",\"), \"\\n  release\", mdx(\"span\", _extends({\n    parentName: \"code\"\n  }, {\n    \"className\": \"token operator\"\n  }), \":\"), \" \", mdx(\"span\", _extends({\n    parentName: \"code\"\n  }, {\n    \"className\": \"token string\"\n  }), \"\\\"%REACT_APP_RELEASE_VERSION%\\\"\"), mdx(\"span\", _extends({\n    parentName: \"code\"\n  }, {\n    \"className\": \"token punctuation\"\n  }), \",\"), \"\\n\", mdx(\"span\", _extends({\n    parentName: \"code\"\n  }, {\n    \"className\": \"token punctuation\"\n  }), \"}\"), mdx(\"span\", _extends({\n    parentName: \"code\"\n  }, {\n    \"className\": \"token punctuation\"\n  }), \")\"), mdx(\"span\", _extends({\n    parentName: \"code\"\n  }, {\n    \"className\": \"token punctuation\"\n  }), \";\"))))))), mdx(\"blockquote\", {\n    parentName: \"li\"\n  }, mdx(\"p\", {\n    parentName: \"blockquote\"\n  }, mdx(\"strong\", {\n    parentName: \"p\"\n  }, \"Note:\"), \" the release version environment variable is set in the project.json during build time and is injected into the generated markup.\")))), mdx(\"h2\", {\n    \"id\": \"step-3-try-your-changes-----generate-another-error\",\n    \"style\": {\n      \"position\": \"relative\"\n    }\n  }, mdx(\"a\", _extends({\n    parentName: \"h2\"\n  }, {\n    \"href\": \"#step-3-try-your-changes-----generate-another-error\",\n    \"aria-label\": \"step 3 try your changes     generate another error 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  })))), \"Step 3: Try your changes --- generate another error\"), mdx(\"ol\", null, mdx(\"li\", {\n    parentName: \"ol\"\n  }, mdx(\"p\", {\n    parentName: \"li\"\n  }, \"If your terminal is still serving the demo app on localhost, click \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"^C\"), \" to shut down the local server\")), mdx(\"li\", {\n    parentName: \"ol\"\n  }, mdx(\"p\", {\n    parentName: \"li\"\n  }, \"Build, deploy, and rerun the project by running:\"), mdx(\"div\", _extends({\n    parentName: \"li\"\n  }, {\n    \"className\": \"code-tabs-wrapper\"\n  }), mdx(CodeTabs, {\n    mdxType: \"CodeTabs\"\n  }, mdx(CodeBlock, {\n    language: \"Node\",\n    title: \"\",\n    filename: \"\",\n    mdxType: \"CodeBlock\"\n  }, mdx(\"div\", _extends({\n    parentName: \"div\"\n  }, {\n    \"className\": \"gatsby-highlight\",\n    \"data-language\": \"node\"\n  }), mdx(\"pre\", _extends({\n    parentName: \"div\"\n  }, {\n    \"className\": \"language-node\"\n  }), mdx(\"code\", _extends({\n    parentName: \"pre\"\n  }, {\n    \"className\": \"language-node\"\n  }), \"> npm run deploy\")))))), mdx(\"blockquote\", {\n    parentName: \"li\"\n  }, mdx(\"p\", {\n    parentName: \"blockquote\"\n  }, \"Note: A Makefile is generally unforgiving when it comes to indentation. If you're getting unexpected errors while running the above command, make sure the \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"sentry-cli\"), \" commands are properly prefixed with a \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"tab\"), \".\"))), mdx(\"li\", {\n    parentName: \"ol\"\n  }, mdx(\"p\", {\n    parentName: \"li\"\n  }, \"Take a look at the terminal log. Notice that the minified scripts and source maps were uploaded to the release version.\"), mdx(\"p\", {\n    parentName: \"li\"\n  }, mdx(\"span\", _extends({\n    parentName: \"p\"\n  }, {\n    \"className\": \"gatsby-resp-image-wrapper\",\n    \"style\": {\n      \"position\": \"relative\",\n      \"display\": \"block\",\n      \"marginLeft\": \"auto\",\n      \"marginRight\": \"auto\",\n      \"maxWidth\": \"707px\"\n    }\n  }), \"\\n      \", mdx(\"a\", _extends({\n    parentName: \"span\"\n  }, {\n    \"className\": \"gatsby-resp-image-link\",\n    \"href\": \"/static/1bf65e341776be77ec3d782dde17ab33/394f7/upload-source-maps-07.png\",\n    \"style\": {\n      \"display\": \"block\"\n    },\n    \"target\": \"_blank\",\n    \"rel\": \"noopener\"\n  }), \"\\n    \", mdx(\"span\", _extends({\n    parentName: \"a\"\n  }, {\n    \"className\": \"gatsby-resp-image-background-image\",\n    \"style\": {\n      \"paddingBottom\": \"28.333333333333332%\",\n      \"position\": \"relative\",\n      \"bottom\": \"0\",\n      \"left\": \"0\",\n      \"backgroundImage\": \"url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAGCAIAAABM9SnKAAAACXBIWXMAAAsSAAALEgHS3X78AAAA+UlEQVQY001P7XaDIAzlMVYNRIuC4UNk9Win7ex6zvb+j7Ro92M5ISQXknsjlmUZx/FyifM85WGo61prrZQCAJSAAEr++Sv/h0jxfH5t2+e6fKzrMk1TDGFIyVrLM0A30BrJcfcWWntERgw0Rp7PIqWc+qGPybmQjjZmds4ZojfrTj4VFErrCxeLMJSdLxjh3KfSkFhv9Xprr9f2fm+9J2MsK2fZiKgr1KgqVFIh17JiHNVxEEpeSjwe1feP2TaTM3Ezk+ecmZ+IyxBjbDoqKDL/qX9/SUDT8TyeIHJu5tmPoyPifXflbCw7hMjvUu6/+Doc1N708t1+AV3bNlMK+sUQAAAAAElFTkSuQmCC')\",\n      \"backgroundSize\": \"cover\",\n      \"display\": \"block\"\n    }\n  })), \"\\n  \", mdx(\"img\", _extends({\n    parentName: \"a\"\n  }, {\n    \"className\": \"gatsby-resp-image-image\",\n    \"alt\": \"Release Created\",\n    \"title\": \"Release Created\",\n    \"src\": \"/static/1bf65e341776be77ec3d782dde17ab33/394f7/upload-source-maps-07.png\",\n    \"srcSet\": [\"/static/1bf65e341776be77ec3d782dde17ab33/5a46d/upload-source-maps-07.png 300w\", \"/static/1bf65e341776be77ec3d782dde17ab33/0a47e/upload-source-maps-07.png 600w\", \"/static/1bf65e341776be77ec3d782dde17ab33/394f7/upload-source-maps-07.png 707w\"],\n    \"sizes\": \"(max-width: 707px) 100vw, 707px\",\n    \"style\": {\n      \"width\": \"100%\",\n      \"height\": \"100%\",\n      \"margin\": \"0\",\n      \"verticalAlign\": \"middle\",\n      \"position\": \"absolute\",\n      \"top\": \"0\",\n      \"left\": \"0\"\n    },\n    \"loading\": \"lazy\"\n  })), \"\\n  \"), \"\\n    \"))), mdx(\"li\", {\n    parentName: \"ol\"\n  }, mdx(\"p\", {\n    parentName: \"li\"\n  }, \"In your browser, make sure that the dev console is open and perform an \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"Empty Cache and Hard Reload\"), \" to make sure the updated code is being served.\"), mdx(\"p\", {\n    parentName: \"li\"\n  }, mdx(\"span\", _extends({\n    parentName: \"p\"\n  }, {\n    \"className\": \"gatsby-resp-image-wrapper\",\n    \"style\": {\n      \"position\": \"relative\",\n      \"display\": \"block\",\n      \"marginLeft\": \"auto\",\n      \"marginRight\": \"auto\",\n      \"maxWidth\": \"1200px\"\n    }\n  }), \"\\n      \", mdx(\"a\", _extends({\n    parentName: \"span\"\n  }, {\n    \"className\": \"gatsby-resp-image-link\",\n    \"href\": \"/static/9eddc5e6d24d47d6916c8f0003272df2/d0ab7/upload-source-maps-08.png\",\n    \"style\": {\n      \"display\": \"block\"\n    },\n    \"target\": \"_blank\",\n    \"rel\": \"noopener\"\n  }), \"\\n    \", mdx(\"span\", _extends({\n    parentName: \"a\"\n  }, {\n    \"className\": \"gatsby-resp-image-background-image\",\n    \"style\": {\n      \"paddingBottom\": \"32.666666666666664%\",\n      \"position\": \"relative\",\n      \"bottom\": \"0\",\n      \"left\": \"0\",\n      \"backgroundImage\": \"url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAHCAIAAACHqfpvAAAACXBIWXMAAAsSAAALEgHS3X78AAABdklEQVQY02P4+vXb69ev371///DR44ePnjx/8fLT5y8fP32GoM9fvn7+8u3L1+9fv/0Ao5+fPn1+/u77t09vvn//yvD165fv378D9b969er379//kQCQ+/Hjx78g8A8J/f39B0j9+fLlC8P1GzfuP3h44eKl69dvvHj+4jkQPHsONOjt27dPnzy9devW9+/f/v0D6YEb+vcPiN1S38Hw4d3bhw/u3751A6j54qUr5y5cunj52qPHT+/du3//4eMnz178+vULqPQfkov+/PkDJGsqGhkmLd09ffGmhqnrVm49+vXNw7cPLtw6tWPOhJa7Ny/tW7VwSnnWsv6WeU2lO5bNBxkBtv8P2Ob6qhYGi+CS9JJW++jaxLKJb++cWjW/f9Xi6WtnNl25cKK3IDlQkSfTxy7KQrM3PwnsYJCdEC801bYzZJW19c9c4plYl1w9a/O6ZRmF5bl13ZvWLf348m5nQXqkkVKsq7WXuviM2iK4ZqjN1S0A+YhVSm4157UAAAAASUVORK5CYII=')\",\n      \"backgroundSize\": \"cover\",\n      \"display\": \"block\"\n    }\n  })), \"\\n  \", mdx(\"img\", _extends({\n    parentName: \"a\"\n  }, {\n    \"className\": \"gatsby-resp-image-image\",\n    \"alt\": \"Release Created\",\n    \"title\": \"Release Created\",\n    \"src\": \"/static/9eddc5e6d24d47d6916c8f0003272df2/c1b63/upload-source-maps-08.png\",\n    \"srcSet\": [\"/static/9eddc5e6d24d47d6916c8f0003272df2/5a46d/upload-source-maps-08.png 300w\", \"/static/9eddc5e6d24d47d6916c8f0003272df2/0a47e/upload-source-maps-08.png 600w\", \"/static/9eddc5e6d24d47d6916c8f0003272df2/c1b63/upload-source-maps-08.png 1200w\", \"/static/9eddc5e6d24d47d6916c8f0003272df2/d0ab7/upload-source-maps-08.png 1532w\"],\n    \"sizes\": \"(max-width: 1200px) 100vw, 1200px\",\n    \"style\": {\n      \"width\": \"100%\",\n      \"height\": \"100%\",\n      \"margin\": \"0\",\n      \"verticalAlign\": \"middle\",\n      \"position\": \"absolute\",\n      \"top\": \"0\",\n      \"left\": \"0\"\n    },\n    \"loading\": \"lazy\"\n  })), \"\\n  \"), \"\\n    \"))), mdx(\"li\", {\n    parentName: \"ol\"\n  }, mdx(\"p\", {\n    parentName: \"li\"\n  }, \"Generate the error again by adding products to your cart and clicking \", mdx(\"strong\", {\n    parentName: \"p\"\n  }, \"Checkout\"))), mdx(\"li\", {\n    parentName: \"ol\"\n  }, mdx(\"p\", {\n    parentName: \"li\"\n  }, \"Check your Email for the alert about the new error and click \", mdx(\"strong\", {\n    parentName: \"p\"\n  }, \"View on Sentry\"), \" to open the issue page\")), mdx(\"li\", {\n    parentName: \"ol\"\n  }, mdx(\"p\", {\n    parentName: \"li\"\n  }, \"Notice that\"), mdx(\"ul\", {\n    parentName: \"li\"\n  }, mdx(\"li\", {\n    parentName: \"ul\"\n  }, \"The event is now tagged with the \", mdx(\"inlineCode\", {\n    parentName: \"li\"\n  }, \"Release ID\")), mdx(\"li\", {\n    parentName: \"ul\"\n  }, \"The error stack trace is now un-minified and includes the file name, method name, line and column number, and source code context in every stack frame\")), mdx(\"p\", {\n    parentName: \"li\"\n  }, mdx(\"span\", _extends({\n    parentName: \"p\"\n  }, {\n    \"className\": \"gatsby-resp-image-wrapper\",\n    \"style\": {\n      \"position\": \"relative\",\n      \"display\": \"block\",\n      \"marginLeft\": \"auto\",\n      \"marginRight\": \"auto\",\n      \"maxWidth\": \"1200px\"\n    }\n  }), \"\\n      \", mdx(\"a\", _extends({\n    parentName: \"span\"\n  }, {\n    \"className\": \"gatsby-resp-image-link\",\n    \"href\": \"/static/25282dc62c7625447e7e9e00ecd444ae/df438/upload-source-maps-09.png\",\n    \"style\": {\n      \"display\": \"block\"\n    },\n    \"target\": \"_blank\",\n    \"rel\": \"noopener\"\n  }), \"\\n    \", mdx(\"span\", _extends({\n    parentName: \"a\"\n  }, {\n    \"className\": \"gatsby-resp-image-background-image\",\n    \"style\": {\n      \"paddingBottom\": \"82%\",\n      \"position\": \"relative\",\n      \"bottom\": \"0\",\n      \"left\": \"0\",\n      \"backgroundImage\": \"url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAQCAIAAACZeshMAAAACXBIWXMAAAsSAAALEgHS3X78AAACN0lEQVQoz41S227UMBDN/38KEg+0QBGVeOABxANUUISg7G63e0kc24nv90uYZIu0QggxOjk6HnvGM/E0TgfBjFJZyahU4lyOjHMVhPYgGNejDNIE8HPppLJcSG1DrrVMU7MVD7fo+zf6cItXG9YRMqKedtRQZsggO6JB48GAv8eiHwzXTpkY8xLcB9Ja1HraBkrjaKyzPmmXfEggrM/GJWVjTDnXHFLRLodc6jTB15RUo8/BBm+DNb7UChvz3sKnQ2BSxQ/vcdcKSH7zkW42g/W2UUbTcXQhhAwpE5RTziMXgIVY2s5qG1MpqLdSz4U3Uqj9ruVMGu3gZim0dSHFAm1FSJYKYE6coKYCBstaas4gazPqrmW047gTBAl6GNFB9FgNSFIkCNYj0SPoXtKW414NsAQGzb1s1vLLntEV3m0ZOirSmeEoyZD1kPTCiiY1a+CTc/GM0RxS1+DIspvLK6e3+w+r89+YWOVN65Ge24S+EsTmqUKSmWf9d6QleKisefd1/ezJ9sXF9vrV4c119/qqvbo8vrw4/AuXh+dPj28/3TedQ1b7mJML0S+wDgYkzfc/Yn7qc4AT7h4LlO3QPFM59RhjSjEhqO8JpdbDGBoz74Xy+8FPyEvZ49IzFTwKFegA02KG0S4wyhQhI+Me2PnpHNbX4CcSeHOndzeb9ef95ub+J2BF0R1uf5LujnSrAYP+gdt7TneKnWMvxdoeG5OtiBrAgxJB8SCZFwvLxfkoVLZ/QGf3C3spifS/PdIIAAAAAElFTkSuQmCC')\",\n      \"backgroundSize\": \"cover\",\n      \"display\": \"block\"\n    }\n  })), \"\\n  \", mdx(\"img\", _extends({\n    parentName: \"a\"\n  }, {\n    \"className\": \"gatsby-resp-image-image\",\n    \"alt\": \"Release Created\",\n    \"title\": \"Release Created\",\n    \"src\": \"/static/25282dc62c7625447e7e9e00ecd444ae/c1b63/upload-source-maps-09.png\",\n    \"srcSet\": [\"/static/25282dc62c7625447e7e9e00ecd444ae/5a46d/upload-source-maps-09.png 300w\", \"/static/25282dc62c7625447e7e9e00ecd444ae/0a47e/upload-source-maps-09.png 600w\", \"/static/25282dc62c7625447e7e9e00ecd444ae/c1b63/upload-source-maps-09.png 1200w\", \"/static/25282dc62c7625447e7e9e00ecd444ae/df438/upload-source-maps-09.png 1556w\"],\n    \"sizes\": \"(max-width: 1200px) 100vw, 1200px\",\n    \"style\": {\n      \"width\": \"100%\",\n      \"height\": \"100%\",\n      \"margin\": \"0\",\n      \"verticalAlign\": \"middle\",\n      \"position\": \"absolute\",\n      \"top\": \"0\",\n      \"left\": \"0\"\n    },\n    \"loading\": \"lazy\"\n  })), \"\\n  \"), \"\\n    \")))), mdx(\"h2\", {\n    \"id\": \"step-4-explore-the-release\",\n    \"style\": {\n      \"position\": \"relative\"\n    }\n  }, mdx(\"a\", _extends({\n    parentName: \"h2\"\n  }, {\n    \"href\": \"#step-4-explore-the-release\",\n    \"aria-label\": \"step 4 explore the release 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  })))), \"Step 4: Explore the release\"), mdx(\"p\", null, \"Creating a release version and uploading the source maps through the Sentry CLI, creates a \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"Release\"), \" entity in your Sentry account.\"), mdx(\"ol\", null, mdx(\"li\", {\n    parentName: \"ol\"\n  }, mdx(\"p\", {\n    parentName: \"li\"\n  }, \"Click on \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"Releases\"), \" from the left side panel, notice that a new release version was created\"), mdx(\"p\", {\n    parentName: \"li\"\n  }, mdx(\"span\", _extends({\n    parentName: \"p\"\n  }, {\n    \"className\": \"gatsby-resp-image-wrapper\",\n    \"style\": {\n      \"position\": \"relative\",\n      \"display\": \"block\",\n      \"marginLeft\": \"auto\",\n      \"marginRight\": \"auto\",\n      \"maxWidth\": \"1200px\"\n    }\n  }), \"\\n      \", mdx(\"a\", _extends({\n    parentName: \"span\"\n  }, {\n    \"className\": \"gatsby-resp-image-link\",\n    \"href\": \"/static/09d98865f90db1e960d9a6adf41bab67/eff3b/upload-source-maps-013.png\",\n    \"style\": {\n      \"display\": \"block\"\n    },\n    \"target\": \"_blank\",\n    \"rel\": \"noopener\"\n  }), \"\\n    \", mdx(\"span\", _extends({\n    parentName: \"a\"\n  }, {\n    \"className\": \"gatsby-resp-image-background-image\",\n    \"style\": {\n      \"paddingBottom\": \"31%\",\n      \"position\": \"relative\",\n      \"bottom\": \"0\",\n      \"left\": \"0\",\n      \"backgroundImage\": \"url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAGCAIAAABM9SnKAAAACXBIWXMAAAsSAAALEgHS3X78AAAA/0lEQVQY04WQS0rEQBCGcwuH2etiMkRxpUQNEReDizG6cecJvJuOGkR84IVMmE6nH/XottocQPigvyoa/qrKrsr7pryrFuv24cMjdb3yQMABkKwHbZyRhziVzo/GCkiEzPI5Wx3e1otmf3b28vhpiQfjHLEBssgiE1IOo/3pttpY48A6cB4sYHaxvKmXzcG8en3+Ro5KaeLQ90prwyGGGFkIQpDAyaXpAa3HlHxeXBezk3bz7gN3yspYEqHGJGp02nkpt9qKKOOkqa0XxLM6b6p8XcxP282bBPSDd4CyjwBEfz6RXEhNRCGNXe5dHu+u8p2j9ukrxjjKMsT/Mt3iF5HJMdrkPtL3AAAAAElFTkSuQmCC')\",\n      \"backgroundSize\": \"cover\",\n      \"display\": \"block\"\n    }\n  })), \"\\n  \", mdx(\"img\", _extends({\n    parentName: \"a\"\n  }, {\n    \"className\": \"gatsby-resp-image-image\",\n    \"alt\": \"Release Created\",\n    \"title\": \"Release Created\",\n    \"src\": \"/static/09d98865f90db1e960d9a6adf41bab67/c1b63/upload-source-maps-013.png\",\n    \"srcSet\": [\"/static/09d98865f90db1e960d9a6adf41bab67/5a46d/upload-source-maps-013.png 300w\", \"/static/09d98865f90db1e960d9a6adf41bab67/0a47e/upload-source-maps-013.png 600w\", \"/static/09d98865f90db1e960d9a6adf41bab67/c1b63/upload-source-maps-013.png 1200w\", \"/static/09d98865f90db1e960d9a6adf41bab67/d61c2/upload-source-maps-013.png 1800w\", \"/static/09d98865f90db1e960d9a6adf41bab67/eff3b/upload-source-maps-013.png 2072w\"],\n    \"sizes\": \"(max-width: 1200px) 100vw, 1200px\",\n    \"style\": {\n      \"width\": \"100%\",\n      \"height\": \"100%\",\n      \"margin\": \"0\",\n      \"verticalAlign\": \"middle\",\n      \"position\": \"absolute\",\n      \"top\": \"0\",\n      \"left\": \"0\"\n    },\n    \"loading\": \"lazy\"\n  })), \"\\n  \"), \"\\n    \"))), mdx(\"li\", {\n    parentName: \"ol\"\n  }, mdx(\"p\", {\n    parentName: \"li\"\n  }, \"Click on the release, notice that the error in your app has been associated with this release and is listed as a \", mdx(\"strong\", {\n    parentName: \"p\"\n  }, \"New Issue\")), mdx(\"p\", {\n    parentName: \"li\"\n  }, mdx(\"span\", _extends({\n    parentName: \"p\"\n  }, {\n    \"className\": \"gatsby-resp-image-wrapper\",\n    \"style\": {\n      \"position\": \"relative\",\n      \"display\": \"block\",\n      \"marginLeft\": \"auto\",\n      \"marginRight\": \"auto\",\n      \"maxWidth\": \"1200px\"\n    }\n  }), \"\\n      \", mdx(\"a\", _extends({\n    parentName: \"span\"\n  }, {\n    \"className\": \"gatsby-resp-image-link\",\n    \"href\": \"/static/167a75e768813bd0ee2696257785478d/74e37/upload-source-maps-014.png\",\n    \"style\": {\n      \"display\": \"block\"\n    },\n    \"target\": \"_blank\",\n    \"rel\": \"noopener\"\n  }), \"\\n    \", mdx(\"span\", _extends({\n    parentName: \"a\"\n  }, {\n    \"className\": \"gatsby-resp-image-background-image\",\n    \"style\": {\n      \"paddingBottom\": \"60.333333333333336%\",\n      \"position\": \"relative\",\n      \"bottom\": \"0\",\n      \"left\": \"0\",\n      \"backgroundImage\": \"url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAMCAIAAADtbgqsAAAACXBIWXMAAAsSAAALEgHS3X78AAABaklEQVQoz3WSi27kIAxF8/8/WGm1q25n2jxmEgLmDQZ6SbajbatGRzfG8jWGZDAx25TJhU0Zz+UnbGJBdpVa+6hc0L4z7Npex9u4bMp6dHngMn82Z0Gmm0PqBceWw30311nsZKVx8EtySjvE2oUAG1pkRgBSrbm1WGrkemYGLrXUVlsrtUIfAfRBTDmEZHprQ2R9THCBofTnn+0nzharkJskn/NOZpxXFyJ2LqCg4qz70P+XADWkrVCEjIvxtkns380pc2KGhpgzDhNzzxxLKGYMmJsZoPgYpFv62HihZUp8tO/jnec5T94ed3E+H4O0QwfOVUkjNpVwiaV1aqdwlTspqWNICKz13+9ioOBuVip2VLxpAUrsoUjOtN2tXPQ+qXWW4vwon8wX/fz09vx7vv5ZLr/GvzN+BNaqdBBQNZJJZf0aJt9C+2Je+PViXy56evPz1U5TWOZ4u5dta/taBbQHRYw8x5a+mN8BClq6sIC/euwAAAAASUVORK5CYII=')\",\n      \"backgroundSize\": \"cover\",\n      \"display\": \"block\"\n    }\n  })), \"\\n  \", mdx(\"img\", _extends({\n    parentName: \"a\"\n  }, {\n    \"className\": \"gatsby-resp-image-image\",\n    \"alt\": \"Release Created\",\n    \"title\": \"Release Created\",\n    \"src\": \"/static/167a75e768813bd0ee2696257785478d/c1b63/upload-source-maps-014.png\",\n    \"srcSet\": [\"/static/167a75e768813bd0ee2696257785478d/5a46d/upload-source-maps-014.png 300w\", \"/static/167a75e768813bd0ee2696257785478d/0a47e/upload-source-maps-014.png 600w\", \"/static/167a75e768813bd0ee2696257785478d/c1b63/upload-source-maps-014.png 1200w\", \"/static/167a75e768813bd0ee2696257785478d/74e37/upload-source-maps-014.png 1732w\"],\n    \"sizes\": \"(max-width: 1200px) 100vw, 1200px\",\n    \"style\": {\n      \"width\": \"100%\",\n      \"height\": \"100%\",\n      \"margin\": \"0\",\n      \"verticalAlign\": \"middle\",\n      \"position\": \"absolute\",\n      \"top\": \"0\",\n      \"left\": \"0\"\n    },\n    \"loading\": \"lazy\"\n  })), \"\\n  \"), \"\\n    \"))), mdx(\"li\", {\n    parentName: \"ol\"\n  }, mdx(\"p\", {\n    parentName: \"li\"\n  }, \"Click on the \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"Artifacts\"), \" tab, notice the minified resources and source maps are available for this release and used to source map stack traces\"), mdx(\"p\", {\n    parentName: \"li\"\n  }, mdx(\"span\", _extends({\n    parentName: \"p\"\n  }, {\n    \"className\": \"gatsby-resp-image-wrapper\",\n    \"style\": {\n      \"position\": \"relative\",\n      \"display\": \"block\",\n      \"marginLeft\": \"auto\",\n      \"marginRight\": \"auto\",\n      \"maxWidth\": \"1200px\"\n    }\n  }), \"\\n      \", mdx(\"a\", _extends({\n    parentName: \"span\"\n  }, {\n    \"className\": \"gatsby-resp-image-link\",\n    \"href\": \"/static/fca4ffa9ba92ad1546f47408ee9361e7/d1882/upload-source-maps-015.png\",\n    \"style\": {\n      \"display\": \"block\"\n    },\n    \"target\": \"_blank\",\n    \"rel\": \"noopener\"\n  }), \"\\n    \", mdx(\"span\", _extends({\n    parentName: \"a\"\n  }, {\n    \"className\": \"gatsby-resp-image-background-image\",\n    \"style\": {\n      \"paddingBottom\": \"39.333333333333336%\",\n      \"position\": \"relative\",\n      \"bottom\": \"0\",\n      \"left\": \"0\",\n      \"backgroundImage\": \"url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAICAIAAAB2/0i6AAAACXBIWXMAAAsSAAALEgHS3X78AAABGklEQVQY0z2OCY6FIAxAuf8dJ5nkjyKLIpssbWHqN5G8kPbRloqc63W1GC9rHMe9Y2vwwulDrd2f6Tg81wSfS2k5F5FSOXb/tQWAEAfRzRgTkdjcIKV0HfbcrSul89BaIacizjOqzRrt3BG4P4TMPzgX1LbzRoDYAbmZwXvofMbdEkhQH8zAiZ0IBnaGrgj+4L3HpMkSKs+4a57KF6GL+aTF4K7Bqm74Zji1tD/xWraf/fcvrfz6icsjVTOmW7HhdjhnnNW7WbVMJfESjVof/aFAqVBhAkuffMXKMsRoshUGTFDxNH7fDr2YYCO3Tj7jy5zUBtWvoVl8oX7HEDHkKOSQEuUKUgLfK6NI6alf1FCvkbhxysHS1gXWf0LZzBjqOj3qAAAAAElFTkSuQmCC')\",\n      \"backgroundSize\": \"cover\",\n      \"display\": \"block\"\n    }\n  })), \"\\n  \", mdx(\"img\", _extends({\n    parentName: \"a\"\n  }, {\n    \"className\": \"gatsby-resp-image-image\",\n    \"alt\": \"Release Created\",\n    \"title\": \"Release Created\",\n    \"src\": \"/static/fca4ffa9ba92ad1546f47408ee9361e7/c1b63/upload-source-maps-015.png\",\n    \"srcSet\": [\"/static/fca4ffa9ba92ad1546f47408ee9361e7/5a46d/upload-source-maps-015.png 300w\", \"/static/fca4ffa9ba92ad1546f47408ee9361e7/0a47e/upload-source-maps-015.png 600w\", \"/static/fca4ffa9ba92ad1546f47408ee9361e7/c1b63/upload-source-maps-015.png 1200w\", \"/static/fca4ffa9ba92ad1546f47408ee9361e7/d1882/upload-source-maps-015.png 1562w\"],\n    \"sizes\": \"(max-width: 1200px) 100vw, 1200px\",\n    \"style\": {\n      \"width\": \"100%\",\n      \"height\": \"100%\",\n      \"margin\": \"0\",\n      \"verticalAlign\": \"middle\",\n      \"position\": \"absolute\",\n      \"top\": \"0\",\n      \"left\": \"0\"\n    },\n    \"loading\": \"lazy\"\n  })), \"\\n  \"), \"\\n    \")))), mdx(\"h2\", {\n    \"id\": \"next\",\n    \"style\": {\n      \"position\": \"relative\"\n    }\n  }, mdx(\"a\", _extends({\n    parentName: \"h2\"\n  }, {\n    \"href\": \"#next\",\n    \"aria-label\": \"next 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  })))), \"Next\"), mdx(\"p\", null, \"Now that we have all the information we need about the error and a clear stack trace, the next thing is to assign the right developer to handle it.\"), mdx(\"p\", null, mdx(\"a\", _extends({\n    parentName: \"p\"\n  }, {\n    \"href\": \"/guides/integrate-frontend/configure-scms/\"\n  }), \"Enable Suspect Commits\")));\n}\n;\nMDXContent.isMDXComponent = true;","tableOfContents":{"items":[{"url":"#step-1-prepare-the-build-environment","title":"Step 1: Prepare the build environment"},{"url":"#step-2-create-a-release-and-upload-source-maps","title":"Step 2: Create a release and upload source maps"},{"url":"#step-3-try-your-changes-----generate-another-error","title":"Step 3: Try your changes --- generate another error"},{"url":"#step-4-explore-the-release","title":"Step 4: Explore the release"},{"url":"#next","title":"Next"}]},"internal":{"type":"Mdx"}}}},"pageContext":{"excerpt":"A  release version  is a dynamic identifier that changes whenever you ship a new version of your code. When you give Sentry information about your releases, you unlock several features, including source mapping of minified JavaScript stack traces upon ingestion. For more information, see  Releases .\nIn this section, we will: Utilize the  Sentry CLI   during the build process  to update your Sentry account by: Creating a new release version Uploading the project's latest source maps (and associate them with the new release version) Add the release version to the Sentry SDK configuration --- this will associate any error captured by the SDK in our app to this specific release. Sentry will use the release's uploaded source maps to unminify the error's stack trace. As part of the  CI/CD workflow  for this app demo, we're using a  Makefile  to handle the  sentry-cli  related tasks through  make  targets. If you're using a different code base, you can still apply the settings and commands described below to your specific setup or run them directly in a command-line shell as part of your build process. For more information, see  Command Line Interface . Step 1: Prepare the build environment We use the  Makefile  in the  frontend-monitoring  project to handle Sentry related tasks utilizing the  sentry-cli . The CLI is already available through the project dependencies (see  package.json ) and requires several parameters to be available to run. Open the  Makefile Uncomment the commented environment variables  SENTRY_AUTH_TOKEN  ,  SENTRY_ORG , and  SENTRY_PROJECT  (remove the leading  # ) To find the SENTRY_ORG and SENTRY_PROJECT values Open your Sentry account and click  Settings > Projects Your Organization ID is part of the browser URL (for example,  https://sentry.io/settings/**SENTRY_ORG**/projects/ ) The SENTRY_PROJECT value is the name that appears in the project tile Copy the values and paste them in the Makefile To create a  SENTRY_AUTH_TOKEN Click on the  Developer Settings  menu option name from the left side panel to create a new integration and org-level auth token Click on  New Internal Integration Enter a  Name Under  Permissions  set  Release:Admin  and  Organization:Read & Write Click on  Save Changes Once the save is successfully confirmed, scroll down to the bottom of the page and copy the allocated token under  TOKENS Paste the token in the Makefile The Makefile should look like this: Step 2: Create a release and upload source maps Now we can invoke the  sentry-cli  to let Sentry know we have a new release and upload the project's source maps to it. You can set a custom release version to suit your naming conventions or let the Sentry CLI propose a version. To build the  frontend-monitoring  project, we use the  react-scripts  package that also generates source maps under  ./build/static/js/ In the Makefile, add a new environment variable for the release version, utilizing Sentry CLI to propose the version value At the bottom of the Makefile, paste the following targets utilizing the Sentry CLI to: Create a new release entity in your Sentry account Upload the project's source maps to the new release The Makefile contains a  setup_release  target that is invoked from the  package.json  file when running  $ npm run deploy  to build and run the project. We'll use this target to invoke all the release related tasks. Replace the existing  setup_release  with: Your Makefile should look like this: Now that you created a release version, you can associate any errors captured in your app to that release through the SDK. Open the  index.html  file and add a new configuration option to the SDK. Assign the release version environment variable to the  release  key Note:  the release version environment variable is set in the project.json during build time and is injected into the generated markup. Step 3: Try your changes --- generate another error If your terminal is still serving the demo app on localhost, click  ^C  to shut down the local server Build, deploy, and rerun the project by running: Note: A Makefile is generally unforgiving when it comes to indentation. If you're getting unexpected errors while running the above command, make sure the  sentry-cli  commands are properly prefixed with a  tab . Take a look at the terminal log. Notice that the minified scripts and source maps were uploaded to the release version. In your browser, make sure that the dev console is open and perform an  Empty Cache and Hard Reload  to make sure the updated code is being served. Generate the error again by adding products to your cart and clicking  Checkout Check your Email for the alert about the new error and click  View on Sentry  to open the issue page Notice that The event is now tagged with the  Release ID The error stack trace is now un-minified and includes the file name, method name, line and column number, and source code context in every stack frame Step 4: Explore the release Creating a release version and…","title":"Enable Readable Stack Traces in your Errors","description":null,"draft":null,"noindex":null,"notoc":null,"sidebar_order":null,"redirect_from":["/guides/integrate-frontend/upload-source-maps/"],"keywords":null,"id":"534092a6-4ae4-5c96-8678-dfab5b21f95e","legacy":false}},"staticQueryHashes":["1218203755","1222113826","1222113826","1766336459","2158593473","2764967025","3345802723","3818502851","3990806462","4015007367","4192517163","4264099332","518019976"]}