すべてのスキル > SDK セットアップ > Browser SDK

Sentry Browser SDK

プロジェクトをスキャンして、ブラウザ向け JavaScript の完全な Sentry セットアップをガイドする意思決定型ウィザード — バニラ JS、jQuery、静的サイト、WordPress、フレームワーク固有の SDK が適用されない JavaScript プロジェクト向け。

このスキルを呼び出すタイミング

• ユーザーが「ウェブサイトに Sentry を追加する」またはプレーン JavaScript に Sentry をセットアップするよう依頼
• ユーザーが @sentry/browser をインストールするか、ローダー スクリプトを設定したい
• ユーザーが WordPress、Shopify、Squarespace、または静的 HTML サイトを使用している
• ユーザーがフレームワークなしでエラー監視、トレース、セッション リプレイ、またはロギングを必要としている
• フレームワーク固有の SDK が適用されない場合

注記： 以下の SDK バージョンと API は @sentry/browser ≥10.0.0 を反映しています。 実装前に必ず docs.sentry.io/platforms/javascript/ に対して確認してください。

---

フェーズ 1: 検出

重要 — フレームワークを先に確認してください。 フレームワーク固有の SDK はより高いカバレッジを提供し、@sentry/browser で進める前に推奨される必要があります。

ステップ 1A: フレームワーク検出（見つかった場合はリダイレクト）

# React を確認
cat package.json 2>/dev/null | grep -E '"react"'

# Next.js を確認
cat package.json 2>/dev/null | grep '"next"'

# Vue を確認
cat package.json 2>/dev/null | grep '"vue"'

# Angular を確認
cat package.json 2>/dev/null | grep '"@angular/core"'

# Svelte / SvelteKit を確認
cat package.json 2>/dev/null | grep -E '"svelte"|"@sveltejs/kit"'

# Remix を確認
cat package.json 2>/dev/null | grep -E '"@remix-run/react"|"@remix-run/node"'

# Nuxt を確認
cat package.json 2>/dev/null | grep '"nuxt"'

# Astro を確認
cat package.json 2>/dev/null | grep '"astro"'

# Ember を確認
cat package.json 2>/dev/null | grep '"ember-source"'

# Node.js サーバー フレームワークを確認（SDK が違う）
cat package.json 2>/dev/null | grep -E '"express"|"fastify"|"@nestjs/core"|"koa"'

フレームワークが検出された場合はここで停止してリダイレクトしてください：

検出されたフレームワーク	リダイレクト先
next	sentry-nextjs-sdk スキルを読み込む — ここで進まないでください
react (Next.js なし)	sentry-react-sdk スキルを読み込む — ここで進まないでください
vue	@sentry/vue を提案 — docs.sentry.io/platforms/javascript/guides/vue/ を参照
@angular/core	@sentry/angular を提案 — docs.sentry.io/platforms/javascript/guides/angular/ を参照
@sveltejs/kit	sentry-svelte-sdk スキルを読み込む — ここで進まないでください
svelte (SPA、kit なし)	@sentry/svelte を提案 — docs.sentry.io/platforms/javascript/guides/svelte/ を参照
@remix-run	@sentry/remix を提案 — docs.sentry.io/platforms/javascript/guides/remix/ を参照
nuxt	@sentry/nuxt を提案 — docs.sentry.io/platforms/javascript/guides/nuxt/ を参照
astro	@sentry/astro を提案 — docs.sentry.io/platforms/javascript/guides/astro/ を参照
ember-source	@sentry/ember を提案 — docs.sentry.io/platforms/javascript/guides/ember/ を参照
express / fastify / @nestjs/core	これは Node.js サーバー — sentry-node-sdk または sentry-nestjs-sdk スキルを読み込む

リダイレクトが重要な理由： フレームワーク SDK はルータ対応トランザクション、エラー バウンダリ、コンポーネント トラッキング、および多くの場合 SSR カバレッジを追加します。React または Next.js アプリで @sentry/browser を直接使用すると、これらすべてが失われます。

フレームワークが検出されない場合のみ @sentry/browser で続行してください。

ステップ 1B: インストール方法の検出

# そもそも package.json があるかを確認（バンドラー環境）
ls package.json 2>/dev/null

# パッケージ マネージャーを確認
ls package-lock.json yarn.lock pnpm-lock.yaml bun.lockb 2>/dev/null

# ビルド ツールを確認
ls vite.config.ts vite.config.js webpack.config.js rollup.config.js esbuild.config.js 2>/dev/null
cat package.json 2>/dev/null | grep -E '"vite"|"webpack"|"rollup"|"esbuild"'

# CMS または静的サイト インジケータを確認
ls wp-config.php wp-content/ 2>/dev/null   # WordPress
ls _config.yml _config.yaml 2>/dev/null    # Jekyll
ls config.toml 2>/dev/null                 # Hugo
ls .eleventy.js 2>/dev/null                # Eleventy

# 既存の Sentry を確認
cat package.json 2>/dev/null | grep '"@sentry/'
grep -r "sentry-cdn.com\|js.sentry-cdn.com" . --include="*.html" -l 2>/dev/null | head -3

判定すべき内容：

質問	影響
package.json が存在 + バンドラー？	→ パス A: npm install
WordPress、Shopify、静的 HTML、npm なし？	→ パス B: ローダー スクリプト
スクリプト タグのみ、ローダー スクリプト アクセスなし？	→ パス C: CDN バンドル
既に @sentry/browser がある？	インストール スキップ、フィーチャー設定に直進
ビルド ツールが Vite / webpack / Rollup / esbuild？	ソース マップ プラグインを設定

---

フェーズ 2: 推奨

見つけた内容に基づいて推奨を提示します。具体的な提案をリードし、オープンエンドな質問はしないでください。

推奨（コア カバレッジ）:

• ✅ エラー監視 — 常に実施；ハンドルされていないエラーと promise 拒否をキャプチャします
• ✅ トレース — インタラクティブなサイトで推奨；ページ読み込みとユーザー インタラクションを追跡します
• ✅ セッション リプレイ — ユーザー向けアプリで推奨；エラー周辺のセッションを記録します

オプション（エンハンスド可観測性）:

• ⚡ ユーザー フィードバック — エラー後のユーザーからのレポートを直接キャプチャ
• ⚡ ロギング — Sentry.logger.* 経由の構造化ログ；npm または CDN ログ バンドルが必要（ローダー スクリプト経由では利用不可）
• ⚡ プロファイリング — JS セルフ プロファイリング API；ベータ、Chromium のみ、Document-Policy: js-profiling レスポンス ヘッダが必須

フィーチャー推奨ロジック：

フィーチャー	推奨する場合...
エラー監視	常に実施 — 変わらないベースライン
トレース	常に実施 インタラクティブ ページ — ページ読み込みとナビゲーション スパンは高値
セッション リプレイ	ユーザー向けアプリ、サポート フロー、またはチェックアウト ページ
ユーザー フィードバック	サポート重視アプリ；アプリ内バグ レポート（スクリーンショット付き）が必要
ロギング	構造化ログ検索またはログ対トレース相関が必要；npm パスのみ
プロファイリング	パフォーマンス重視、Chromium のみアプリ；Document-Policy: js-profiling ヘッダが必須

インストール パス推奨：

シナリオ	推奨パス
プロジェクトに package.json + バンドラーがある	パス A (npm) — 完全なフィーチャー、ソース マップ、ツリー シェイキング
WordPress、Shopify、Squarespace、静的 HTML	パス B (ローダー スクリプト) — ビルド ツール不要、常に最新
ローダー スクリプト アクセスなし静的 HTML	パス C (CDN バンドル) — 手動 <script> タグ

提案例：「エラー監視 + トレース + セッション リプレイを使用してパス A (npm) でセットアップすることをお勧めします。ロギングまたはユーザー フィードバックも追加しますか?」

---

フェーズ 3: ガイド

パス A: npm / yarn / pnpm（推奨 — バンドラー プロジェクト）

インストール

npm install @sentry/browser --save
# or
yarn add @sentry/browser
# or
pnpm add @sentry/browser

src/instrument.ts を作成

Sentry は他のコードが実行される前に初期化する必要があります。Sentry.init() を専用のサイドカー ファイルに配置してください：

import * as Sentry from "@sentry/browser";

Sentry.init({
  dsn: import.meta.env.VITE_SENTRY_DSN, // ビルド ツール別に調整（以下の表を参照）
  environment: import.meta.env.MODE,
  release: import.meta.env.VITE_APP_VERSION, // ビルド時にインジェクト

  sendDefaultPii: true,

  integrations: [
    Sentry.browserTracingIntegration(),
    Sentry.replayIntegration({
      maskAllText: true,
      blockAllMedia: true,
    }),
  ],

  // トレース
  tracesSampleRate: 1.0, // 本番環境では 0.1–0.2 に低下
  tracePropagationTargets: ["localhost", /^https:\/\/yourapi\.io/],

  // セッション リプレイ
  replaysSessionSampleRate: 0.1,
  replaysOnErrorSampleRate: 1.0,

  enableLogs: true,
});

ビルド ツール別 DSN 環境変数：

ビルド ツール	変数名	コード内アクセス
Vite	VITE_SENTRY_DSN	import.meta.env.VITE_SENTRY_DSN
カスタム webpack	SENTRY_DSN	process.env.SENTRY_DSN
esbuild	SENTRY_DSN	process.env.SENTRY_DSN
Rollup	SENTRY_DSN	process.env.SENTRY_DSN

エントリ ポイント セットアップ

instrument.ts を最初のインポートとして、エントリ ファイルにインポートしてください：

// src/main.ts or src/index.ts
import "./instrument";  // ← 最初の必須

// ... アプリの残り

ソース マップ セットアップ（強く推奨）

ソース マップがないと、スタック トレースはミニファイされたコードを表示します。ビルド プラグインをセットアップして、ソース マップを自動的にアップロードしてください：

専用ブラウザ ウィザードはありません： npx @sentry/wizard -i browser フラグはありません。最も近いのは npx @sentry/wizard@latest -i sourcemaps で、既に初期化された SDK のソース マップ アップロードのみを設定します。

Vite (vite.config.ts):

import { defineConfig } from "vite";
import { sentryVitePlugin } from "@sentry/vite-plugin";

export default defineConfig({
  build: { sourcemap: "hidden" },
  plugins: [
    // sentryVitePlugin は最後である必須
    sentryVitePlugin({
      org: process.env.SENTRY_ORG,
      project: process.env.SENTRY_PROJECT,
      authToken: process.env.SENTRY_AUTH_TOKEN,
    }),
  ],
});

webpack (webpack.config.js):

const { sentryWebpackPlugin } = require("@sentry/webpack-plugin");

module.exports = {
  devtool: "hidden-source-map",
  plugins: [
    sentryWebpackPlugin({
      org: process.env.SENTRY_ORG,
      project: process.env.SENTRY_PROJECT,
      authToken: process.env.SENTRY_AUTH_TOKEN,
    }),
  ],
};

Rollup (rollup.config.js):

import { sentryRollupPlugin } from "@sentry/rollup-plugin";

export default {
  output: { sourcemap: "hidden" },
  plugins: [
    sentryRollupPlugin({
      org: process.env.SENTRY_ORG,
      project: process.env.SENTRY_PROJECT,
      authToken: process.env.SENTRY_AUTH_TOKEN,
    }),
  ],
};

esbuild (build.js):

const { sentryEsbuildPlugin } = require("@sentry/esbuild-plugin");

require("esbuild").build({
  entryPoints: ["src/index.ts"],
  bundle: true,
  sourcemap: "hidden",
  plugins: [
    sentryEsbuildPlugin({
      org: process.env.SENTRY_ORG,
      project: process.env.SENTRY_PROJECT,
      authToken: process.env.SENTRY_AUTH_TOKEN,
    }),
  ],
});

⚠️ esbuild プラグインは splitting: true に完全対応していません。コード スプリッティングが有効な場合は代わりに sentry-cli を使用してください。

sentry-cli を使用（任意のツールチェーン / CI）:

# ビルド ステップ後：
npx @sentry/cli sourcemaps inject ./dist
npx @sentry/cli sourcemaps upload ./dist

認証用に .env を追加（コミットしないこと）：

SENTRY_AUTH_TOKEN=sntrys_...
SENTRY_ORG=my-org-slug
SENTRY_PROJECT=my-project-slug

---

パス B: ローダー スクリプト（WordPress、静的サイト、Shopify、Squarespace）

最適な用途： ビルド システムのないサイト。ローダー スクリプトは、常に Sentry の CDN 経由で最新に保たれ、SDK が読み込まれる前にエラーをバッファする単一の <script> タグです。

ローダー スクリプトを取得： Sentry UI → 設定 → プロジェクト → （プロジェクト） → SDK セットアップ → ローダー スクリプト

生成されたタグをコピーして、すべてのページの最初のスクリプトとして配置してください：

<!DOCTYPE html>
<html>
  <head>
    <!-- ローダー タグの前に設定 -->
    <script>
      window.sentryOnLoad = function () {
        Sentry.init({
          // DSN は既にローダー URL で設定済み
          tracesSampleRate: 1.0,
          replaysSessionSampleRate: 0.1,
          replaysOnErrorSampleRate: 1.0,
        });
      };
    </script>

    <!-- ローダー スクリプト 最初 — 他のすべてのスクリプトより前 -->
    <script
      src="https://js.sentry-cdn.com/YOUR_PUBLIC_KEY.min.js"
      crossorigin="anonymous"
    ></script>
  </head>
  ...
</html>

ローダー読み込みモード：

モード	方法	SDK の読み込みタイミング
Lazy（デフォルト）	追加なし	最初のエラーまたは手動 Sentry 呼び出し時
Eager	<script> に data-lazy="no" を追加	すべてのページ スクリプト後
手動	Sentry.forceLoad() を呼び出す	呼び出す時点で

SDK 読み込み前に安全に呼び出せる（バッファ）:

• Sentry.captureException()
• Sentry.captureMessage()
• Sentry.captureEvent()
• Sentry.addBreadcrumb()
• Sentry.withScope()

その他のメソッドには Sentry.onLoad() を使用：

<script>
  window.Sentry && Sentry.onLoad(function () {
    Sentry.setUser({ id: "123" });
  });
</script>

グローバル経由でリリースを設定（オプション）:

<script>
  window.SENTRY_RELEASE = { id: "my-app@1.0.0" };
</script>

ローダー スクリプトの制限：

• ❌ Sentry.logger.*（ロギング）なし — npm パスのみ
• ❌ フレームワーク固有のフィーチャーなし（React ErrorBoundary、Vue ルータ トラッキング等）
• ❌ トレース ヘッダは SDK 読み込み後の fetch 呼び出しにのみ追加
• ❌ バージョン変更は CDN キャッシュ経由で数分かかる
• ⚠️ ローダーを使用する場合、他のすべてのスクリプトで defer（async ではなく）を使用

CSP 要件：

script-src: https://browser.sentry-cdn.com https://js.sentry-cdn.com
connect-src: *.sentry.io

---

パス C: CDN バンドル（手動スクリプト タグ）

最適な用途： ローダー スクリプトは使用できないが、同期読み込みが必要なページ。

フィーチャー要件に対応するバンドルを選択し、他のすべてのスクリプトの前に配置してください：

エラーのみ（最小フットプリント）:

<script
  src="https://browser.sentry-cdn.com/10.42.0/bundle.min.js"
  integrity="sha384-L/HYBH2QCeLyXhcZ0hPTxWMnyMJburPJyVoBmRk4OoilqrOWq5kU4PNTLFYrCYPr"
  crossorigin="anonymous"
></script>

エラー + トレース：

<script
  src="https://browser.sentry-cdn.com/10.42.0/bundle.tracing.min.js"
  integrity="sha384-DIqcfVcfIewrWiNWfVZcGWExO5v673hkkC5ixJnmAprAfJajpUDEAL35QgkOB5gw"
  crossorigin="anonymous"
></script>

エラー + セッション リプレイ：

<script
  src="https://browser.sentry-cdn.com/10.42.0/bundle.replay.min.js"
  integrity="sha384-sbojwIJFpv9duIzsI9FRm87g7pB15s4QwJS1m1xMSOdV1CF3pwgrPPEu38Em7M9+"
  crossorigin="anonymous"
></script>

エラー + トレース + リプレイ（推奨フル セットアップ）:

<script
  src="https://browser.sentry-cdn.com/10.42.0/bundle.tracing.replay.min.js"
  integrity="sha384-oo2U4zsTxaHSPXJEnXtaQPeS4Z/qbTqoBL9xFgGxvjJHKQjIrB+VRlu97/iXBtzw"
  crossorigin="anonymous"
></script>

エラー + トレース + リプレイ + ユーザー フィードバック：

<script
  src="https://browser.sentry-cdn.com/10.42.0/bundle.tracing.replay.feedback.min.js"
  integrity="sha384-SmHU39Qs9cua0KLtq3A6gis1/cqM1nZ6fnGzlvWAPiwhBDO5SmwFQV65BBpJnB3n"
  crossorigin="anonymous"
></script>

フル バンドル（すべてのフィーチャー）:

<script
  src="https://browser.sentry-cdn.com/10.42.0/bundle.tracing.replay.feedback.logs.metrics.min.js"
  integrity="sha384-gOjSzRxwpXpy0FlT6lg/AVhagqrsUrOWUO7jm6TJwuZ9YVHtYK0MBA2hW2FGrIGl"
  crossorigin="anonymous"
></script>

CDN バンドル バリアント概要：

バンドル	フィーチャー	使用タイミング
bundle.min.js	エラーのみ	絶対最小フットプリント
bundle.tracing.min.js	+ トレース	パフォーマンス監視
bundle.replay.min.js	+ リプレイ	セッション記録
bundle.tracing.replay.min.js	+ トレース + リプレイ	完全な可観測性
bundle.tracing.replay.feedback.min.js	+ ユーザー フィードバック	+ アプリ内フィードバック ウィジェット
bundle.logs.metrics.min.js	+ ログ + メトリックス	構造化ログ（CDN）
bundle.tracing.replay.feedback.logs.metrics.min.js	すべて	最大カバレッジ

スクリプト タグ後に初期化：

<script>
  Sentry.init({
    dsn: "https://YOUR_KEY@o0.ingest.sentry.io/YOUR_PROJECT",
    environment: "production",
    release: "my-app@1.0.0",
    integrations: [
      Sentry.browserTracingIntegration(),
      Sentry.replayIntegration({
        maskAllText: true,
        blockAllMedia: true,
      }),
    ],
    tracesSampleRate: 1.0,
    tracePropagationTargets: ["localhost", /^https:\/\/yourapi\.io/],
    replaysSessionSampleRate: 0.1,
    replaysOnErrorSampleRate: 1.0,
  });
</script>

CDN CSP 要件：

script-src: https://browser.sentry-cdn.com https://js.sentry-cdn.com
connect-src: *.sentry.io

---

合意された各フィーチャー

フィーチャーを 1 つずつ説明します。参照ファイルを読み込み、その手順に従い、移動前に確認してください：

フィーチャー	参照	読み込む場合...
エラー監視	${SKILL_ROOT}/references/error-monitoring.md	常に（ベースライン）
トレース	${SKILL_ROOT}/references/tracing.md	ページ読み込み / API 呼び出しトレース
セッション リプレイ	${SKILL_ROOT}/references/session-replay.md	ユーザー向けアプリ
ロギング	${SKILL_ROOT}/references/logging.md	構造化ログ検索；npm または CDN ログ バンドル（ローダー スクリプトではない）
プロファイリング	${SKILL_ROOT}/references/profiling.md	パフォーマンス重視、Chromium のみ
ユーザー フィードバック	${SKILL_ROOT}/references/user-feedback.md	エラー後にユーザー レポートをキャプチャ

各フィーチャー：${SKILL_ROOT}/references/<feature>.md を読む、手順に正確に従う、動作を確認する。

---

設定リファレンス

キー Sentry.init() オプション

オプション	型	デフォルト	注記
dsn	string	—	必須。 空白の場合 SDK は無効
environment	string	"production"	例："staging"、"development"
release	string	—	例："my-app@1.0.0" または git SHA — エラーをリリースにリンク
sendDefaultPii	boolean	false	IP アドレスとリクエスト ヘッダを含む
tracesSampleRate	number	—	0–1；開発環境では 1.0、本番環境では 0.1–0.2
tracesSampler	function	—	トランザクション単位のサンプリング；レート上書き
tracePropagationTargets	(string|RegExp)[]	同一オリジン	分散トレース ヘッダを受け取る発信 URL
replaysSessionSampleRate	number	—	記録されたすべてのセッションの比率
replaysOnErrorSampleRate	number	—	記録されたエラー セッションの比率
enableLogs	boolean	false	Sentry.logger.* API を有効にする（npm または CDN ログ バンドル；ローダー スクリプトではない）
attachStackTrace	boolean	false	captureMessage() 呼び出しのスタック トレース
maxBreadcrumbs	number	100	イベントごとに保存されるブレッドクラム
debug	boolean	false	コンソールへの詳細 SDK 出力
tunnel	string	—	広告ブロッカーをバイパスするプロキシ URL
ignoreErrors	(string|RegExp)[]	[]	これらのパターンに一致するエラーをドロップ
denyUrls	(string|RegExp)[]	[]	これらの URL のスクリプトからのエラーをドロップ
allowUrls	(string|RegExp)[]	[]	これらのスクリプト URL からのみエラーをキャプチャ
spotlight	boolean|string	false	イベントを Spotlight ローカル開発オーバーレイに転送

ブラウザ固有オプション

オプション	型	デフォルト	注記
cdnBaseUrl	string	—	インテグレーションの遅延読み込みのベース URL
skipBrowserExtensionCheck	boolean	false	ブラウザ拡張機能コンテキストの確認をスキップ

window.SENTRY_RELEASE グローバル（CDN / ローダー パス）

SDK が読み込まれる前にリリース バージョンを設定：

<script>
  window.SENTRY_RELEASE = { id: "my-app@1.0.0" };
</script>

---

検証

テスト イベントをトリガーして、Sentry がデータを受信していることを確認：

npm / CDN パス：

<!-- 一時的にページに追加 -->
<button onclick="throw new Error('Sentry Browser Test Error')">
  Test Error
</button>

パフォーマンス検証（npm パス）:

import * as Sentry from "@sentry/browser";

Sentry.startSpan({ name: "Test Span", op: "test" }, () => {
  // 操作
});

手動キャプチャ：

Sentry.captureException(new Error("Manual test"));
Sentry.captureMessage("Manual test message", "info");

Sentry ダッシュボードで確認：

• Issues → エラーは数秒以内に表示
• Traces → ページ読み込みトランザクションが表示
• Replays → ページ操作後にセッション記録が表示
• Logs → ロギング有効時（npm または CDN ログ バンドル）に構造化ログ エントリが表示

何も表示されない場合は Sentry.init() で debug: true を設定し、ブラウザ コンソールを確認してください。

---

フェーズ 4: クロスリンク

ブラウザ セットアップ完了後、Sentry カバレッジが不足しているコンパニオン バックエンドを確認：

ls ../backend ../server ../api ../go ../python 2>/dev/null
cat ../go.mod 2>/dev/null | head -3
cat ../requirements.txt ../pyproject.toml 2>/dev/null | head -3
cat ../Gemfile 2>/dev/null | head -3
cat ../pom.xml 2>/dev/null | grep '<artifactId>' | head -3
cat ../composer.json 2>/dev/null | head -3

バックエンド（Sentry 未設定）が存在する場合は、対応するスキルを提案：

検出されたバックエンド	スキルを提案
Go (go.mod)	sentry-go-sdk
Python (requirements.txt, pyproject.toml)	sentry-python-sdk
Ruby (Gemfile)	sentry-ruby-sdk
PHP (composer.json)	sentry-php-sdk
.NET (*.csproj, *.sln)	sentry-dotnet-sdk
Java (pom.xml, build.gradle)	docs.sentry.io/platforms/java/ を参照
Node.js (Express、Fastify)	sentry-node-sdk
NestJS (@nestjs/core)	sentry-nestjs-sdk

---

トラブルシューティング

問題	解決方法
イベントが表示されない	debug: true を設定、DSN を確認、ブラウザ コンソルで SDK エラーを確認
ソース マップが機能していない	本番モードでビルド（npm run build）；SENTRY_AUTH_TOKEN が設定されていることを確認
ミニファイされたスタック トレース	ソース マップがアップロードされていない — ビルド プラグイン設定を確認；npx @sentry/wizard@latest -i sourcemaps を実行
CDN バンドルが見つからない	URL のバージョン番号を確認；最新版は browser.sentry-cdn.com を参照
SRI integrity エラー	ハッシュ不一致 — integrity 属性を含め、フルの <script> タグをこのスキルから再コピー
ローダー スクリプトが起動しない	ページの最初の <script> であることを確認；コンソルで CSP エラーを確認
トレースがローダーで機能していない	SDK 読み込み前の fetch 呼び出しはトレースされない — 早期呼び出しを Sentry.onLoad() でラップ
sentryOnLoad が呼び出されない	ローダー <script> タグの前に window.sentryOnLoad を定義する必須
ロギングが利用不可	Sentry.logger.* には npm または名前に .logs. がある CDN バンドルが必須 — ローダー スクリプト経由ではサポートされない
プロファイリングが機能していない	ドキュメント レスポンスに Document-Policy: js-profiling ヘッダがあることを確認；Chromium のみ
広告ブロッカーがイベントをドロップ	tunnel: "/sentry-tunnel" を設定、サーバー側リレー エンドポイントを追加
セッション リプレイが記録していない	replayIntegration() が init にあること確認；replaysSessionSampleRate > 0 であることを確認
リプレイ CSP エラー	worker-src 'self' blob: と child-src 'self' blob: を CSP に追加
tracePropagationTargets が一致していない	正規表現エスケープを確認；デフォルトは同一オリジンのみ
ブラウザ拡張機能によってイベントがブロック	denyUrls: [/chrome-extension:\/\//] を追加して拡張機能エラーをフィルタ
イベント ボリューム過多	本番環境で sampleRate（エラー）と tracesSampleRate を 1.0 から低下
デプロイ後にソース マップアップロード	エラー発生前にソース マップをアップロード必須 — CI/CD に統合
esbuild スプリッティング競合	sentryEsbuildPlugin は splitting: true をサポートしていない — 代わりに sentry-cli を使用