ClaudeMods
☰
JA
● — 人がオンライン ・閲覧 — 回
スポンサー作品を投稿
チュートリアル · 投稿者 DIY Smart Code

Claude Code Mods とは何か、そしてどのように動作するか #ClaudeCode #Tutorial

Claude Code mods とは何か、/plugin でのインストールと無効化、claude plugin validate での検証、Claude での作成、claude plugin test でのオフラインテストを扱う 3 分間のハンズオンチュートリアル。

翻訳済み

この mod について

バージョン 2.1.296 での Claude Code mods のハンズオンウォークスルー:5 時間、7 日間、コンテキスト使用量を表示し、80% でポップアップ、97% でサウンドを鳴らす使用量メーター mod。mod は JS/TS イベントハンドラーを備えたプラグインであり、hooks/hooks.json の modules キーで区別され、mod だけがインターフェースに描画できることを説明します。/plugin install でのインストール、Space での無効化、クリーンなセッションのための --safe-mode、claude plugin validate での mod のチェック($.process.run のような呼び出しに注意)、プラグイン作成スキルを使って Claude に mod を ~/.claude/dev-mods/ に書かせ、ホットリロードを可能にすること、サインインやネットワークなしで claude plugin test をオフラインで実行することを扱います。

インストール

インストール方法は元のソースをご確認ください。

原文 / README

What Are Claude Code Mods and How Do They Work #ClaudeCode #Tutorial

Claude Code mods, hands-on: the four mods running on my own Claude Code, how to install one and switch it off, how to check a mod with claude plugin validate before you install it, and how to have Claude write one for you. A mod is a plugin with code that Claude Code runs inside itself, so it can draw in the interface where a settings hook can't.

Higgsfield AI — Create AI Videos & Visuals Get 10% OFF here: https://higgsfield.ai?fpr=thomas-dccf7e

🚀 DYNAMOUS AI COMMUNITY

Want to learn agentic coding with live daily events and workshops? Check out Dynamous AI: https://dynamous.ai/?code=646a60 Get 10% off here 👉 https://shorturl.smartcode.diy/dynamous_ai_10_percent_discount

⚡ HOSTINGER — RELIABLE HOSTING FOR YOUR PROJECTS (10% OFF)

Whether you're shipping a portfolio, a side project, n8n flows, or AI agents — I use Hostinger for fast, affordable VPS + web hosting.

Get 10% off here 👉 https://hostinger.com/DIYSMARTCODE

n8n: https://n8n.partnerlinks.io/diysmartcode

(Affiliate links — costs you nothing, supports the channel.)

What you will see in this 3-minute breakdown: → A real run on Claude Code 2.1.296: /plugin shows "4 mods active", and my usage-meter mod writes 5-hour, 7-day and context usage under the prompt, with a pop-up at 80% and a sound at 97% → What a mod is: a plugin with JavaScript or TypeScript event handlers that Claude Code calls on a tool call, a submitted prompt, or a part of the interface being drawn. One "modules" key in the plugin's hooks/hooks.json makes it a mod → Mods vs settings hooks: a settings hook runs as a command outside Claude Code and can stop a tool call, but only a mod can add a pane or a band to the screen. My studio-hud band picked up a render check the moment Claude ran it → Install with /plugin install plugin-name@marketplace (mods need Claude Code v2.1.287 or later). Switch one off in the Installed tab of /plugin with Space. For one session without installed mods, start with --safe-mode, which turns off your other customizations too → Check before you install: claude plugin validate lists every event a mod hooks and every call it makes, without running it. Look for calls like $.process.run, which starts programs as you → Let Claude write one: describe the mod in a session, Claude writes it with the built-in plugin-authoring skill into ~/.claude/dev-mods/, you enable hot reloading for the session, and you copy the folder out to keep it → Test it offline: claude plugin test runs a mod's tests with no session, sign-in or network. All five usage-meter tests pass

Claude Code docs, Mods overview (install, /plugin, --safe-mode, validate): https://code.claude.com/docs/en/plugins/mods/overview Claude Code docs, Create a mod (modules key, plugin-authoring, hot reloading, dev-mods): https://code.claude.com/docs/en/plugins/mods/create Claude Code docs, Test a mod (claude plugin test): https://code.claude.com/docs/en/plugins/mods/test Claude Code docs, Manage mods (the calls to look for): https://code.claude.com/docs/en/plugins/mods/admin Claude Code docs, Mods reference (events): https://code.claude.com/docs/en/plugins/mods/reference Claude Code docs, Install plugins (enable or disable with Space): https://code.claude.com/docs/en/plugins/install Claude Code docs, CLI reference (--safe-mode): https://code.claude.com/docs/en/cli-reference Claude Code docs, Status line (5-hour and 7-day usage): https://code.claude.com/docs/en/statusline Claude Code changelog (2.1.287, Claude Mods): https://code.claude.com/docs/en/changelog Our Claude Code mods launch Short: https://youtu.be/tTe7GOJuc0E

Which would you build first: a usage warning, or a slash command of your own?

#ClaudeCode #Claude #ClaudeCodeMods #ClaudeMods #ClaudeCodePlugins #ClaudePlugins #ClaudeCodeTutorial #ClaudeCodeTips #ClaudeCodeSetup #ClaudeCodeForBeginners #ClaudeCodeHooks #Anthropic #AICoding #AIAgents #AgenticCoding #DeveloperTools #CodingWithAI #VibeCoding #DevTips #Shorts

関連作品