Add sourcemaps wizard instructions to uploading source maps docs (#7304)

Add docs for the new source maps wizard. The wizard will walk users through configuring source maps upload by running

```
npx @sentry/wizard@latest -i sourcemaps
```

In this patch, the wizard instructions are added to these pages:

- Source Maps index page
- Affected bundler plugin pages (Webpack, Vite, Rollup, esbuild, tsc, sentry-cli)

Co-authored-by: getsantry[bot] <66042841+getsantry[bot]@users.noreply.github.com>
Co-authored-by: Luca Forstner <luca.forstner@sentry.io>

Author: 3 people

src/includes/sentry-cli-sourcemaps.mdx

@@ -1,4 +1,4 @@
-## 2. Configure Sentry CLI
+### 2. Configure Sentry CLI
 
 <Note>
 
@@ -22,7 +22,7 @@ SENTRY_ORG=___ORG_SLUG___
 SENTRY_PROJECT=___PROJECT_SLUG___
 ```
 
-## 3. Inject Debug IDs Into Artifacts
+### 3. Inject Debug IDs Into Artifacts
 
 Debug IDs are used to match the stack frame of an event with its corresponding minified source and source map file. Visit [What are Artifact Bundles](/platforms/javascript/sourcemaps/troubleshooting_js/artifact-bundles/) if you want to learn more about Artifact Bundles and Debug IDs.
 
@@ -32,7 +32,7 @@ To inject Debug IDs, use the following command:
 sentry-cli sourcemaps inject /path/to/directory
 ```
 
-### Verify Debug IDs Were Injected in Artifacts
+#### Verify Debug IDs Were Injected in Artifacts
 
 Minified source files should contain at the end a comment named `debugId` like:
 
@@ -52,21 +52,21 @@ Source maps should contain a field named `debug_id` like:
 }
 ```
 
-## 4. Upload Artifact Bundle
+### 4. Upload Artifact Bundle
 
 After you've injected Debug IDs into your artifacts, upload them using the following command.
 
 ```bash
 sentry-cli sourcemaps upload /path/to/directory
 ```
 
-### Verify That Artifact Bundles Were Uploaded
+#### Verify That Artifact Bundles Were Uploaded
 
 Open up Sentry and navigate to **Project Settings > Source Maps**. If you choose “Artifact Bundles” in the tabbed navigation, you'll see all the artifact bundles that have been successfully uploaded to Sentry.
 
-## Optional Steps
+### Optional Steps
 
-### Associating `release` with Artifact Bundle
+#### Associating `release` with Artifact Bundle
 
 Provide a `release` property in your SDK options.
 
@@ -90,7 +90,7 @@ Running `upload` with `--release` **doesn't automatically create a release in Se
 
 </Note>
 
-### Associating `dist` with Artifact Bundle
+#### Associating `dist` with Artifact Bundle
 
 In addition to `release`, you can also add a `dist` to your uploaded artifacts, to set the distribution identifier for uploaded files. To do so, run the `sourcemaps upload` command with the additional `--dist` option.
 
@@ -100,7 +100,7 @@ The distribution identifier is used to distinguish between multiple files of the
 sentry-cli sourcemaps upload --release=<release_name> --dist=<dist_name> /path/to/directory
 ```
 
-## 5. Deploy your Application
+### 5. Deploy your Application
 
 If you're following this guide from your local machine, then you've successfully:
 

src/includes/sourcemaps-cli-step-one.mdx

@@ -1,6 +1,4 @@
-<Include name="debug-id-requirement.mdx" />
-
-## 1. Generate Source Maps
+### 1. Generate Source Maps
 
 You will need to generate source maps with the tooling of your choice. See examples from other guides linked under [Uploading Source Maps](https://docs.sentry.io/platforms/javascript/sourcemaps/?uploading-source-maps).
 

src/includes/sourcemaps-typescript.mdx

@@ -6,7 +6,17 @@ This guide is only applicable if you're using `tsc` to compile your project. If
 
 </Note>
 
-## 1. Generate Source Maps
+## Automatic Setup
+
+The easiest way to configure uploading source maps with `tsc` and `sentry-cli` is by using the Sentry Wizard:
+
+<Include name="sourcemaps-wizard-instructions.mdx" />
+
+If you want to configure source maps upload manually instead, follow the steps below.
+
+## Manual Setup
+
+### 1. Generate Source Maps
 
 First, configure the TypeScript compiler to output source maps:
 

src/includes/sourcemaps-wizard-instructions.mdx

@@ -0,0 +1,17 @@
+```bash
+npx @sentry/wizard@latest -i sourcemaps
+```
+
+The wizard will guide you through the following steps:
+
+- Logging into Sentry and selecting a project
+- Installing the necessary Sentry packages
+- Configuring your build tool to generate and upload source maps
+- Configuring your CI to upload source maps
+
+<Alert level="warning">
+
+Configuring source maps upload with the Sentry Wizard is still experimental and [under development](https://github.com/getsentry/sentry-wizard/issues/290).
+Let us know on [GitHub](https://github.com/getsentry/sentry-wizard/issues/new/choose) if you have feedback or issues.
+
+</Alert>

src/platform-includes/sourcemaps/overview/javascript.mdx

@@ -1,6 +1,10 @@
 ## Uploading Source Maps
 
-We've compiled a list of guides on how to upload source maps to Sentry for the most popular JavaScript build tools:
+The easiest way to configure uploading source maps is by using the Sentry Wizard:
+
+<Include name="sourcemaps-wizard-instructions.mdx" />
+
+If you want to configure source maps upload manually, follow the guide for your bundler or build tool below.
 
 ### Sentry Bundler Support
 

src/platform-includes/sourcemaps/overview/javascript.svelte.mdx

@@ -8,7 +8,15 @@ If you are on an older version and you want to upload source maps we recommend u
 
 </Note>
 
-This page is a guide on how to create releases and upload source maps to Sentry when bundling your Svelte app.
+### Using the Sentry Wizard
+
+The easiest way to configure uploading source maps is by using the Sentry Wizard:
+
+<Include name="sourcemaps-wizard-instructions.mdx" />
+
+If you want to configure source maps upload manually, follow the guide for your bundler or build tool below.
+
+### Manually Configuring Source Maps Upload
 
 To generate source maps with your Svelte project, you need to set the source map [compiler options](https://svelte.dev/docs#compile-time-svelte-compile) in your Svelte config:
 

src/platform-includes/sourcemaps/upload/cli/javascript.mdx

@@ -1,3 +1,15 @@
 In this guide, you'll learn how to successfully upload source maps using our `sentry-cli` tool.
 
+<Include name="debug-id-requirement.mdx" />
+
+## Automatic Setup
+
+The easiest way to configure uploading source maps with Sentry CLI is by using the Sentry Wizard:
+
+<Include name="sourcemaps-wizard-instructions.mdx" />
+
+If you want to configure source maps upload with the CLI, follow the steps below.
+
+## Manual Setup
+
 <Include name="sourcemaps-cli-step-one.mdx" />

src/platform-includes/sourcemaps/upload/esbuild/javascript.mdx

@@ -8,7 +8,17 @@ If you are on an older version and you want to upload source maps we recommend u
 
 You can use the Sentry esbuild plugin to automatically create releases and upload source maps to Sentry when bundling your app.
 
-## Install
+## Automatic Setup
+
+The easiest way to configure uploading source maps with esbuild is by using the Sentry Wizard:
+
+<Include name="sourcemaps-wizard-instructions.mdx" />
+
+If you want to configure source maps upload with esbuild manually, follow the steps below.
+
+## Manual Setup
+
+Install the Sentry esbuild plugin:
 
 ```bash {tabTitle:npm}
 npm install @sentry/esbuild-plugin --save-dev
@@ -18,7 +28,7 @@ npm install @sentry/esbuild-plugin --save-dev
 yarn add @sentry/esbuild-plugin --dev
 ```
 
-## Configure
+### Configure
 
 Learn more about configuring the plugin in our [Sentry esbuild Plugin documentation](https://www.npmjs.com/package/@sentry/esbuild-plugin).
 
@@ -46,6 +56,6 @@ require("esbuild").build({
 <Note>
 
 The Sentry esbuild plugin doesn't upload source maps in watch-mode/development-mode.
-We recommend running a production build to test your implementation.
+We recommend running a production build to test your configuration.
 
 </Note>

src/platform-includes/sourcemaps/upload/rollup/javascript.mdx

@@ -8,7 +8,17 @@ If you are on an older version and you want to upload source maps we recommend u
 
 You can use the Sentry Rollup plugin to automatically create releases and upload source maps to Sentry when bundling your app.
 
-## Installation
+## Automatic Setup
+
+The easiest way to configure uploading source maps with rollup is by using the Sentry Wizard:
+
+<Include name="sourcemaps-wizard-instructions.mdx" />
+
+If you want to configure source maps upload with rollup manually, follow the steps below.
+
+## Manual Setup
+
+Install the Sentry Rollup plugin:
 
 ```bash {tabTitle:npm}
 npm install @sentry/rollup-plugin --save-dev
@@ -28,6 +38,9 @@ Example:
 import { sentryRollupPlugin } from "@sentry/rollup-plugin";
 
 export default {
+  output: {
+    sourcemap: true, // Source map generation must be turned on
+  },
   plugins: [
     // Put the Sentry rollup plugin after all other plugins
     sentryRollupPlugin({
@@ -39,8 +52,5 @@ export default {
       authToken: process.env.SENTRY_AUTH_TOKEN,
     }),
   ],
-  output: {
-    sourcemap: true, // Source map generation must be turned on
-  },
 };
 ```

src/platform-includes/sourcemaps/upload/vite/javascript.mdx

@@ -8,7 +8,17 @@ If you are on an older version and you want to upload source maps we recommend u
 
 You can use the Sentry Vite plugin to automatically create releases and upload source maps to Sentry when bundling your app.
 
-## Installation
+## Automatic Setup
+
+The easiest way to configure uploading source maps with Vite is by using the Sentry Wizard:
+
+<Include name="sourcemaps-wizard-instructions.mdx" />
+
+If you want to configure source maps upload with Vite manually, follow the steps below.
+
+## Manual Setup
+
+Install the Sentry Vite plugin:
 
 ```bash {tabTitle:npm}
 npm install @sentry/vite-plugin --save-dev
@@ -18,7 +28,7 @@ npm install @sentry/vite-plugin --save-dev
 yarn add @sentry/vite-plugin --dev
 ```
 
-## Configuration
+### Configuration
 
 Learn more about configuring the plugin in our [Sentry Vite Plugin documentation](https://www.npmjs.com/package/@sentry/vite-plugin).
 
@@ -49,6 +59,6 @@ export default defineConfig({
 <Note>
 
 The Sentry Vite plugin doesn't upload source maps in watch-mode/development-mode.
-We recommend running a production build to test your implementation.
+We recommend running a production build to test your configuration.
 
 </Note>