> ## Documentation Index
> Fetch the complete documentation index at: https://dripart-docs-recommend-assets-api.mintlify.site/llms.txt
> Use this file to discover all available pages before exploring further.

# Javascript 拡張

## Comfy クライアントの拡張

Comfy は拡張機制を通じて変更できます。拡張を追加するには、以下が必要です：

* Python モジュールから `WEB_DIRECTORY` をエクスポートし、
* 1 つ以上の `.js` ファイルをそのディレクトリに配置し、
* `app.registerExtension` を使用して拡張を登録します。

これら 3 つのステップは以下に記載します。拡張の追加方法を確認したら、コードを呼び出すために利用可能な [hooks](/custom-nodes/js/javascript_hooks) を確認するか、必要に応じて様々な [Comfy objects](/custom-nodes/js/javascript_objects_and_hijacking) の説明を確認するか、あるいは直接 [example code snippets](/custom-nodes/js/javascript_examples) にジャンプしてください。

### `WEB_DIRECTORY` のエクスポート

Comfy Web クライアントは、カスタムノードディレクトリ内にサブディレクトリ（慣例的に `js` と呼ばれます）を作成し、`WEB_DIRECTORY` をエクスポートすることで拡張できます。そのため、`__init__.py` には以下のような内容を含める必要があります：

```python theme={null}
WEB_DIRECTORY = "./js"
__all__ = ["NODE_CLASS_MAPPINGS", "NODE_DISPLAY_NAME_MAPPINGS", "WEB_DIRECTORY"]
```

### `.js` ファイルの含め方

<Tip>すべての Javascript `.js` ファイルは、Comfy Web ページの読み込み時にブラウザによって自動的に読み込まれます。拡張機能のあるファイルを指定する必要はありません。</Tip>

ウェブページに追加されるのは `.js` ファイル\_のみ\_ です。他のリソース（`.css` ファイルなど）は `extensions/custom_node_subfolder/the_file.css` でアクセスでき、プログラム的に追加できます。

<Warning>そのパスにはサブフォルダの名前は含まれ\_ません\_。`WEB_DIRECTORY` の値はサーバーによって挿入されます。</Warning>

### 拡張の登録

拡張の基本的な構造は、Comfy のメイン `app` オブジェクトをインポートし、`app.registerExtension` を呼び出すことです。この際、一意の `name` と、Comfy コード内のフックによって呼び出される 1 つ以上の関数を含む辞書を渡します。

完全で、単純で、かつ「厄介な」拡張は以下のようになります：

```Javascript theme={null}
import { app } from "../../scripts/app.js";
app.registerExtension({ 
	name: "a.unique.name.for.a.useless.extension",
	async setup() { 
		alert("Setup complete!")
	},
})
```