モノレポの闇を切り裂く：Rollbar SourcemapsとWebpack/Viteの完璧な同期戦略
こんにちは。数々の大規模分散システムを渡り歩いてきたオブザーバビリティ・アーキテクトです。
現場で最も「魂が削れる」瞬間はどこか？ それは、「プロダクションで発生した難解なスタックトレースが、難読化された1行の残骸となって返ってきたとき」です。ソースマップの紐付けは、単なる設定作業ではありません。それは、戦場（本番環境）からのSOS信号を、開発者が理解できる言語へと翻訳する「命綱」です。
特にTurborepoやNxを駆使するモノレポ環境では、ビルドの並列実行や環境ごとの複雑な差異により、この紐付けが容易に破綻します。今日は、その混沌を制圧し、エラー検知から修正までのリードタイムを極限まで短縮する「Rollbar実装の神髄」を伝授します。
—
1. なぜモノレポでRollbar紐付けが失敗するのか？
結論から言えば、「Git SHAの不一致」と「Public Pathのミスマッチ」です。
モノレポでは、アプリごとにビルドのコンテキストが異なります。`@rollbar/webpack-plugin` を単に導入するだけでは、CI環境とローカル、あるいは異なるパッケージ間のソースマップが衝突し、Rollbar側で「どのソースマップを使えばいいのか」が判別不能になります。
必須のベストプラクティス：ビルド識別子の厳格化
Rollbarへのアップロード時に `code_version` を環境変数（Git SHA）で固定するだけでは不十分です。「環境名（Environment）」と「ビルドID」をセットで管理するのがプロの定石です。
—
2. 実践：Webpack/Viteにおける最適解設定
モノレポにおいて、各アプリの `webpack.config.js` または `vite.config.ts` で共有すべき設定構成を示します。
Webpack Pluginの設定例
// webpack.config.js
const RollbarSourceMapPlugin = require(‘@rollbar/webpack-plugin’);
module.exports = {
// …
plugins: [
new RollbarSourceMapPlugin({
accessToken: process.env.ROLLBAR_ACCESS_TOKEN,
version: process.env.GIT_SHA, // CIのSHAを強制注入
publicPath: ‘https://cdn.example.com/assets/’, // 厳密に指定すること
include: /.\.js$/, // 不要なファイルを弾く
silent: false, // 失敗時にCIを止める（重要）
}),
],
};
【テックリードからの助言】
`silent: false` にしてください。CIでソースマップのアップロードが失敗した時、そのビルドは「リリース不可」として即座に落とすべきです。 失敗を黙認することは、未来の自分への負債です。
—
3. 環境変数差異による紐付けミスを防ぐ共有ルール
モノレポでは、ルート階層の `package.json` にスクリプトを定義し、各パッケージに依存させないのが鉄則です。
究極の環境変数構成 (`.env.production`)
紐付け用キー：書き込み専用のトークンを使うこと
ROLLBAR_ACCESS_TOKEN=post_server_access_token_xxx
バージョン管理の要
GIT_SHA=$(git rev-parse HEAD)
紐付けの基準点
ROLLBAR_ENDPOINT=https://api.rollbar.com/api/1/sourcemap
—
4. 開発スピードを加速させる「現場の極意」
① Rollbar CLIをCIパイプラインのファーストクラス市民にする
Webpackプラグインだけに頼らず、CIの最終ステップで確実に `rollbar-cli` を実行するスクリプトを用意しましょう。
CI用スクリプト例
npx rollbar-cli sourcemaps upload \
–token $ROLLBAR_ACCESS_TOKEN \
–version $GIT_SHA \
–minified-url-prefix “https://cdn.example.com/assets/” \
–path ./dist/assets
② 「絶対入れるべき」神プラグイン/ショートカット
- Rollbar Chrome Extension: ブラウザのエラーを即座にダッシュボードへ送信。開発中に「予期せぬエラー」をその場で確認できます。
- VS Code ショートカット: `CMD+Shift+P` でGit SHAをクリップボードにコピーする自作タスクを登録せよ。調査時にRollbarの `code_version` フィルターへ即座にペーストするだけで、今見ているコードとエラーが1秒で同期されます。
③ チーム開発での共有ルール：`rollbar.config.js` の一元管理
モノレポのルートに設定を切り出し、各パッケージから参照させることで、「設定のドリフト（乖離）」を物理的に防ぎます。
// /config/rollbar.config.js
module.exports = {
captureUncaught: true,
captureUnhandledRejections: true,
payload: {
environment: process.env.APP_ENV || ‘development’,
},
};
—
5. 最後に：オブザーバビリティは「文化」である
ソースマップの設定を極めることは、単なるデバッグの効率化ではありません。「エラーが起きた時、誰が一番早く、最も正確に状況を理解できるか」という開発者体験（DX）の向上です。
モノレポの複雑さに逃げず、ビルドプロセスに厳格なガードレールを敷いてください。それが、予測不能な本番障害からチームを守る唯一の手段です。
何か不明点があれば、またいつでも聞いてください。コードは、正しく監視されて初めて完成するのですから。