mf について
mfは、Module Federationプロジェクトの開発者向けスキルです。統合、型チェック、設定、パフォーマンス、実行時診断などの参照資料へ依頼を振り分けます。
主な機能
- 01依頼をMFのサブスキルに振り分け
- 02統合とプロジェクト状況を案内
- 03型・共有依存関係・設定を確認
- 04性能と実行時診断を案内
活用シーン
- 01Module Federationの統合方法を調べる
- 02MFの型エラーや実行時エラーを調査
- 03共有依存関係と設定を確認
インストール
コマンドをコピーしてターミナルで実行します。
npx skills add https:/ / github.com/ module-federation/ agent-skills --skill mfインストール後、Claude Code で/mfを入力して読み込まれたか確認します。
同梱ファイル
SKILL.md と一緒にインストールされる参考資料やスクリプト。
reference/bridge-check.mdconfig-check.mdcontext.mddivebell.mddocs.mdintegrate.mdmodule-info.mdobservability-analyze.mdobservability-page.mdobservability-read.mdobservability-use.mdobservability.mdperf.mdruntime-error.mdshared-deps.mdtype-check.mdreference/browser-debug/long-chain.mdsetup.mdsingle-capture.mdscripts/bridge-check.jsconfig-exposes-check.jsmodule-info.jsobservability-collector.jsperformance-check.jsshared-config-check.jstype-check.js詳細
MF — Module Federation オールインワンスキル
ステップ 1:サブスキルを特定する
$ARGUMENTS を解析し、reference/ ディレクトリ(このファイルと同じディレクトリ)にある参照ファイルに対応付けます。
| サブコマンド(大文字・小文字を区別しない) | 別名 | 参照ファイル |
|---|---|---|
docs | doc、help、? | reference/docs.md |
context | ctx、info、status | reference/context.md |
module-info | module、remote、manifest | reference/module-info.md |
integrate | init、setup、add | reference/integrate.md |
type-check | types、ts、dts | reference/type-check.md |
shared-deps | shared、deps、singleton | reference/shared-deps.md |
perf | performance、hmr、speed | reference/perf.md |
config-check | config、plugin、exposes | reference/config-check.md |
bridge-check | bridge、sub-app | reference/bridge-check.md |
runtime-error | runtime-code、runtime-008、runtime-001、remote-entry | reference/runtime-error.md |
observability | obs、observe、trace、traceId、report、observability、debug-loading、telemetry、runtime-007、moduleInfo、snapshot | reference/observability.md |
明示的なサブコマンドが見つからない場合は、入力全体から意図を判定します。
入力に可観測性レポート、traceId、コンソールの read: コマンド、.mf/observability ファイルパスが含まれる場合、または Module Federation の読み込みデータを観測、デバッグ、トレース、調査、アップロードする方法を尋ねている場合、あるいは可観測性の略称として obs を使っている場合は、同じ入力に RUNTIME-xxx コードが含まれていても reference/observability.md を選択します。
| 入力内のシグナル | 参照ファイル |
|---|---|
| MF の概念、API、設定オプションに関する質問 | reference/docs.md |
| 「integrate」、「add MF」、「setup」、「scaffold」、「new project」 | reference/integrate.md |
| 「type error」、「TS error」、「@mf-types」、「dts」、「typescript」 | reference/type-check.md |
| 「shared」、「singleton」、「duplicate」、「antd」、「transformImport」 | reference/shared-deps.md |
| 「slow」、「HMR」、「performance」、「build speed」、「ts-go」 | reference/perf.md |
| 「plugin」、「asyncStartup」、「exposes key」、「config」 | reference/config-check.md |
| 「bridge」、「sub-app」、「export-app」、「createRemoteAppComponent」 | reference/bridge-check.md |
| 「RUNTIME-001」、「RUNTIME-008」、「runtime error code」、「remote entry load failed」、「ScriptNetworkError」、「ScriptExecutionError」、「container missing」、「window[remoteEntryKey]」 | reference/runtime-error.md |
| 「obs」、「mf obs」、「Observability report generated」、「console.error」、「traceId」、「read:」、「diagnosis」、「ownerHint」、「summary.phases」、「.mf/observability」、「build-report.json」、「latest.json」、「RUNTIME-007」、「moduleInfo」、「remote snapshot」、「global snapshot」、「snapshot match」、「observability」、「observe MF」、「debug MF loading」、「trace loading」、「loading report」、「open page and inspect MF」、「visit URL and observe MF」、「看下 MF 加载情况」、「telemetry」、「onReport」、「onEvent」、「production report」、「upload observability」 | reference/observability.md |
| 「manifest」、「remoteEntry URL」、「module info」、「publicPath」 | reference/module-info.md |
| 「context」、「what is configured」、「MF role」、「bundler」 | reference/context.md |
それでも判断できない場合は、上記のサブコマンド表をユーザーに提示し、選択を求めます。
ステップ 2:参照ファイルを読み込み、実行する
一致したファイルを reference/ ディレクトリ(この SKILL.md と同じディレクトリ)から読み込みます。
そのファイルのすべての指示を実行し、残りの引数(サブコマンドのトークンより後のすべての内容、または意図を判定した場合は $ARGUMENTS 全体)を ARGS として渡します。
選択したワークフローで実際のブラウザページを開く、調査する、または操作する必要がある場合は、まず reference/divebell.md を読み、すべてのブラウザー操作に Divebell を使用します。Divebell と併用して、raw CDP、別途起動したデバッグ用 Chrome、Playwright、Puppeteer、または場当たり的なブラウザースクリプトを使用しないでください。