Buckets:

hf-doc-build
/

doc

Files

xet

hf-doc-build/doc / diffusers /main /ko /modular_diffusers /mellon.html

mishig

about 8 hours ago

download

raw

45 kB

<meta charset="utf-8" /><meta name="hf:doc:metadata" content="{&quot;title&quot;:&quot;Mellon에서 사용자 정의 블록 사용&quot;,&quot;local&quot;:&quot;using-custom-blocks-with-mellon&quot;,&quot;sections&quot;:[],&quot;depth&quot;:2}"/>
		<link href="/docs/diffusers/main/en/_app/immutable/entry/start.vZc-dOUR.js" rel="modulepreload">
		<link href="/docs/diffusers/main/en/_app/immutable/chunks/Bafuik5c.js" rel="modulepreload">
		<link href="/docs/diffusers/main/en/_app/immutable/chunks/Bupkjr9f.js" rel="modulepreload">
		<link href="/docs/diffusers/main/en/_app/immutable/entry/app.B6c3Ml05.js" rel="modulepreload">
		<link href="/docs/diffusers/main/en/_app/immutable/chunks/CyvZ3FS5.js" rel="modulepreload">
		<link href="/docs/diffusers/main/en/_app/immutable/chunks/l0QnnOED.js" rel="modulepreload">
		<link href="/docs/diffusers/main/en/_app/immutable/chunks/DnVIJfC5.js" rel="modulepreload">
		<link href="/docs/diffusers/main/en/_app/immutable/chunks/DsnmJJEf.js" rel="modulepreload">
		<link href="/docs/diffusers/main/en/_app/immutable/nodes/0.BQlx092V.js" rel="modulepreload">
		<link href="/docs/diffusers/main/en/_app/immutable/chunks/CoSrdQax.js" rel="modulepreload">
		<link href="/docs/diffusers/main/en/_app/immutable/nodes/319.9CNMHFHT.js" rel="modulepreload">
		<link href="/docs/diffusers/main/en/_app/immutable/chunks/B4AMoTAu.js" rel="modulepreload">
		<!--1gvor5n--><meta name="hf:doc:metadata" content="{&quot;title&quot;:&quot;Using Custom Blocks with Mellon&quot;,&quot;local&quot;:&quot;using-custom-blocks-with-mellon&quot;,&quot;sections&quot;:[],&quot;depth&quot;:2}"/><!---->
		<link href="/docs/diffusers/main/en/_app/immutable/assets/0.tn0RQdqM.css" rel="modulepreload"> <!--[--><!--[0--><!--[--><!--[0--><!--[--><p></p> <!--[1--><h2 class="relative group"><a id="using-custom-blocks-with-mellon" class="header-link block pr-1.5 text-lg no-hover:hidden with-hover:absolute with-hover:p-1.5 with-hover:opacity-0 with-hover:group-hover:opacity-100 with-hover:right-full" href="#using-custom-blocks-with-mellon"><span><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 256"><path d="M167.594 88.393a8.001 8.001 0 0 1 0 11.314l-67.882 67.882a8 8 0 1 1-11.314-11.315l67.882-67.881a8.003 8.003 0 0 1 11.314 0zm-28.287 84.86l-28.284 28.284a40 40 0 0 1-56.567-56.567l28.284-28.284a8 8 0 0 0-11.315-11.315l-28.284 28.284a56 56 0 0 0 79.196 79.197l28.285-28.285a8 8 0 1 0-11.315-11.314zM212.852 43.14a56.002 56.002 0 0 0-79.196 0l-28.284 28.284a8 8 0 1 0 11.314 11.314l28.284-28.284a40 40 0 0 1 56.568 56.567l-28.285 28.285a8 8 0 0 0 11.315 11.314l28.284-28.284a56.065 56.065 0 0 0 0-79.196z" fill="currentColor"></path></svg><!----></span></a> <span><!---->Mellon에서 사용자 정의 블록 사용<!----></span></h2><!--]--><!----> <p><a href="https://github.com/cubiq/Mellon" rel="nofollow">Mellon</a>은 Modular Diffusers와 통합되는 시각적 워크플로 인터페이스로, 노드 기반 워크플로를 위해 설계되었습니다.</p> <blockquote class="warning"><p>Mellon은 초기 개발 단계에 있으며 아직 프로덕션 사용에 적합하지 않습니다. 이 내용을 통합이 어떻게 작동하는지에 대한 미리보기로 생각해 주세요!</p></blockquote> <p>Mellon에서는 커스텀 블록이 기본적으로 작동합니다 - 저장소에 <code>mellon_pipeline_config.json</code>만 추가하면 됩니다. 이 설정 파일은 Mellon이 블록의 매개변수를 UI 컴포넌트로 렌더링하는 방법을 알려줍니다.</p> <p><a href="https://huggingface.co/diffusers/gemini-prompt-expander-mellon" rel="nofollow">Gemini Prompt Expander</a> 블록을 사용한 실제 동작은 다음과 같습니다:</p> <p><img src="https://huggingface.co/datasets/huggingface/documentation-images/resolve/main/diffusers/modular_demo_dynamic.gif" alt="Mellon custom block demo"/></p> <p>Mellon에서 모듈형 diffusers 커스텀 블록을 사용하려면:</p> <ol><li>ModularDiffusers 섹션에서 <strong>Dynamic Block Node</strong>를 드래그합니다</li> <li><code>repo_id</code>를 입력하세요 (예: <code>diffusers/gemini-prompt-expander-mellon</code>)</li> <li><strong>커스텀 블록 로드</strong>를 클릭하세요</li> <li>노드는 블록의 입력과 출력을 표시하도록 변환됩니다</li></ol> <p>자신의 커스텀 블록에 이 설정을 만드는 방법을 단계별로 살펴보겠습니다.</p> <!--[1--><h2 class="relative group"><a id="steps-to-create-a-mellon-config" class="header-link block pr-1.5 text-lg no-hover:hidden with-hover:absolute with-hover:p-1.5 with-hover:opacity-0 with-hover:group-hover:opacity-100 with-hover:right-full" href="#steps-to-create-a-mellon-config"><span><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 256"><path d="M167.594 88.393a8.001 8.001 0 0 1 0 11.314l-67.882 67.882a8 8 0 1 1-11.314-11.315l67.882-67.881a8.003 8.003 0 0 1 11.314 0zm-28.287 84.86l-28.284 28.284a40 40 0 0 1-56.567-56.567l28.284-28.284a8 8 0 0 0-11.315-11.315l-28.284 28.284a56 56 0 0 0 79.196 79.197l28.285-28.285a8 8 0 1 0-11.315-11.314zM212.852 43.14a56.002 56.002 0 0 0-79.196 0l-28.284 28.284a8 8 0 1 0 11.314 11.314l28.284-28.284a40 40 0 0 1 56.568 56.567l-28.285 28.285a8 8 0 0 0 11.315 11.314l28.284-28.284a56.065 56.065 0 0 0 0-79.196z" fill="currentColor"></path></svg><!----></span></a> <span><!---->Mellon 설정을 만드는 단계<!----></span></h2><!--]--><!----> <ol><li><strong>파라미터에 Mellon 유형 지정</strong> - 각 <code>InputParam</code>/<code>OutputParam</code>에는 Mellon이 어떤 UI 컴포넌트를 렌더링할지 알려주는 유형(예: <code>"textbox"</code>, <code>"dropdown"</code>, <code>"image"</code>)이 필요합니다.</li> <li><strong><code>mellon_pipeline_config.json</code> 생성</strong> - 유틸리티를 사용하여 설정 템플릿을 생성하고 Hub 저장소에 푸시합니다.</li> <li><strong>(선택 사항) config 수동 조정</strong> - 특정 요구 사항에 맞게 생성된 config를 세밀하게 조정합니다.</li></ol> <!--[1--><h2 class="relative group"><a id="specify-mellon-types-for-parameters" class="header-link block pr-1.5 text-lg no-hover:hidden with-hover:absolute with-hover:p-1.5 with-hover:opacity-0 with-hover:group-hover:opacity-100 with-hover:right-full" href="#specify-mellon-types-for-parameters"><span><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 256"><path d="M167.594 88.393a8.001 8.001 0 0 1 0 11.314l-67.882 67.882a8 8 0 1 1-11.314-11.315l67.882-67.881a8.003 8.003 0 0 1 11.314 0zm-28.287 84.86l-28.284 28.284a40 40 0 0 1-56.567-56.567l28.284-28.284a8 8 0 0 0-11.315-11.315l-28.284 28.284a56 56 0 0 0 79.196 79.197l28.285-28.285a8 8 0 1 0-11.315-11.314zM212.852 43.14a56.002 56.002 0 0 0-79.196 0l-28.284 28.284a8 8 0 1 0 11.314 11.314l28.284-28.284a40 40 0 0 1 56.568 56.567l-28.285 28.285a8 8 0 0 0 11.315 11.314l28.284-28.284a56.065 56.065 0 0 0 0-79.196z" fill="currentColor"></path></svg><!----></span></a> <span><!---->매개변수에 대한 Mellon 유형 지정<!----></span></h2><!--]--><!----> <p>Mellon 타입은 각 파라미터가 UI에서 어떻게 렌더링되는지를 결정합니다. 파라미터의 타입을 지정하지 않으면 <code>"custom"</code>로 기본 설정되며, 이는 단순한 연결 점으로 렌더링됩니다. 생성된 config에서 나중에 언제든지 이 값을 조정할 수 있습니다.</p> <table><thead><tr><th>유형</th><th>입력/출력</th><th>설명</th></tr></thead><tbody><tr><td><code>image</code></td><td>둘 다</td><td>이미지 (PIL Image)</td></tr><tr><td><code>video</code></td><td>둘 다</td><td>Video</td></tr><tr><td><code>text</code></td><td>둘 다</td><td>텍스트 표시</td></tr><tr><td><code>textbox</code></td><td>입력</td><td>텍스트 입력</td></tr><tr><td><code>dropdown</code></td><td>입력</td><td>드롭다운 선택 메뉴</td></tr><tr><td><code>slider</code></td><td>입력</td><td>숫자 값을 위한 슬라이더</td></tr><tr><td><code>number</code></td><td>입력</td><td>숫자 입력</td></tr><tr><td><code>checkbox</code></td><td>입력</td><td>Boolean 토글</td></tr></tbody></table> <p>추가 구성이 필요한 파라미터(옵션이 있는 드롭다운, min/max 값이 있는 슬라이더 등)의 경우, 문자열 대신 <code>MellonParam</code> 인스턴스를 직접 전달합니다. 아래 클래스 메서드 중 하나를 사용하거나, <code>MellonParam(name, label, type, ...)</code>으로 완전히 사용자 정의된 인스턴스를 생성할 수 있습니다.</p> <table><thead><tr><th>메서드</th><th>설명</th></tr></thead><tbody><tr><td><code>MellonParam.Input.image(name)</code></td><td>이미지 입력</td></tr><tr><td><code>MellonParam.Input.textbox(name, default)</code></td><td>textarea로 텍스트 입력</td></tr><tr><td><code>MellonParam.Input.dropdown(name, options, default)</code></td><td>드롭다운 선택</td></tr><tr><td><code>MellonParam.Input.slider(name, default, min, max, step)</code></td><td>숫자 값을 위한 슬라이더</td></tr><tr><td><code>MellonParam.Input.number(name, default, min, max, step)</code></td><td>숫자 입력 (슬라이더 없음)</td></tr><tr><td><code>MellonParam.Input.seed(name, default)</code></td><td>randomize 버튼으로 시드 입력</td></tr><tr><td><code>MellonParam.Input.checkbox(name, default)</code></td><td>Boolean 체크박스</td></tr><tr><td><code>MellonParam.Input.model(name)</code></td><td>diffusers 구성 요소의 모델 입력</td></tr><tr><td><code>MellonParam.Output.image(name)</code></td><td>이미지 출력</td></tr><tr><td><code>MellonParam.Output.video(name)</code></td><td>비디오 출력</td></tr><tr><td><code>MellonParam.Output.text(name)</code></td><td>텍스트 출력</td></tr><tr><td><code>MellonParam.Output.model(name)</code></td><td>diffusers 구성 요소의 모델 출력</td></tr></tbody></table> <p>Mellon 유형을 지정하려면 아래 방법 중 하나를 선택하세요.</p> <!--[2--><h3 class="relative group"><a id="using-metadata-in-block-definitions" class="header-link block pr-1.5 text-lg no-hover:hidden with-hover:absolute with-hover:p-1.5 with-hover:opacity-0 with-hover:group-hover:opacity-100 with-hover:right-full" href="#using-metadata-in-block-definitions"><span><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 256"><path d="M167.594 88.393a8.001 8.001 0 0 1 0 11.314l-67.882 67.882a8 8 0 1 1-11.314-11.315l67.882-67.881a8.003 8.003 0 0 1 11.314 0zm-28.287 84.86l-28.284 28.284a40 40 0 0 1-56.567-56.567l28.284-28.284a8 8 0 0 0-11.315-11.315l-28.284 28.284a56 56 0 0 0 79.196 79.197l28.285-28.285a8 8 0 1 0-11.315-11.314zM212.852 43.14a56.002 56.002 0 0 0-79.196 0l-28.284 28.284a8 8 0 1 0 11.314 11.314l28.284-28.284a40 40 0 0 1 56.568 56.567l-28.285 28.285a8 8 0 0 0 11.315 11.314l28.284-28.284a56.065 56.065 0 0 0 0-79.196z" fill="currentColor"></path></svg><!----></span></a> <span><!---->블록 정의에서 메타데이터 사용<!----></span></h3><!--]--><!----> <p>사용자가 처음부터 커스텀 블록을 정의하는 경우, <code>metadata={"mellon": "&lt;type>"}</code>을 <code>InputParam</code> 및 <code>OutputParam</code> 정의에 직접 추가하세요. Hub의 기존 커스텀 블록을 편집하는 경우, 로컬로 다운로드하는 방법은 <a href="./custom_blocks#editing-custom-blocks">커스텀 블록 편집</a>을 참고하세요.</p> <div class="code-block relative "><div class="absolute top-2.5 right-4"><button class="inline-flex items-center relative text-sm focus:text-green-500 cursor-pointer focus:outline-none transition duration-200 ease-in-out opacity-0 mx-0.5   text-gray-600  " title="code excerpt" type="button"><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" fill="currentColor" focusable="false" role="img" width="1em" height="1em" preserveAspectRatio="xMidYMid meet" viewBox="0 0 32 32"><path d="M28,10V28H10V10H28m0-2H10a2,2,0,0,0-2,2V28a2,2,0,0,0,2,2H28a2,2,0,0,0,2-2V10a2,2,0,0,0-2-2Z" transform="translate(0)"></path><path d="M4,18H2V4A2,2,0,0,1,4,2H18V4H4Z" transform="translate(0)"></path><rect fill="none" width="32" height="32"></rect></svg><!----> <div class=" absolute pointer-events-none transition-opacity bg-black text-white py-1 px-2 leading-tight rounded font-normal shadow left-1/2 top-full transform -translate-x-1/2 translate-y-2 opacity-0 "><div class="absolute bottom-full left-1/2 transform -translate-x-1/2 w-0 h-0 border-black border-4 border-t-0" style="border-left-color: transparent; border-right-color: transparent;"></div> 복사됨</div><!----></button><!----></div> <pre class="language-python "><!----><span class="hljs-keyword">class</span> <span class="hljs-title class_">GeminiPromptExpander</span>(<span class="hljs-title class_ inherited__">ModularPipelineBlocks</span>):
    
<span class="hljs-meta">    @property</span>
    <span class="hljs-keyword">def</span> <span class="hljs-title function_">inputs</span>(<span class="hljs-params">self</span>) -&gt; <span class="hljs-type">List</span>[InputParam]:
        <span class="hljs-keyword">return</span> [
            InputParam(
                <span class="hljs-string">&quot;prompt&quot;</span>,
                type_hint=<span class="hljs-built_in">str</span>,
                required=<span class="hljs-literal">True</span>,
                description=<span class="hljs-string">&quot;Prompt to use&quot;</span>,
                metadata={<span class="hljs-string">&quot;mellon&quot;</span>: <span class="hljs-string">&quot;textbox&quot;</span>},  <span class="hljs-comment"># Text input</span>
            )
        ]
    
<span class="hljs-meta">    @property</span>
    <span class="hljs-keyword">def</span> <span class="hljs-title function_">intermediate_outputs</span>(<span class="hljs-params">self</span>) -&gt; <span class="hljs-type">List</span>[OutputParam]:
        <span class="hljs-keyword">return</span> [
            OutputParam(
                <span class="hljs-string">&quot;prompt&quot;</span>,
                type_hint=<span class="hljs-built_in">str</span>,
                description=<span class="hljs-string">&quot;Expanded prompt by the LLM&quot;</span>,
                metadata={<span class="hljs-string">&quot;mellon&quot;</span>: <span class="hljs-string">&quot;text&quot;</span>},  <span class="hljs-comment"># Text output</span>
            ),
            OutputParam(
                <span class="hljs-string">&quot;old_prompt&quot;</span>,
                type_hint=<span class="hljs-built_in">str</span>,
                description=<span class="hljs-string">&quot;Old prompt provided by the user&quot;</span>,
&lt;CopyLLMTxtMenu containerStyle=<span class="hljs-string">&quot;float: inline-end; margin-inline-start: 10px; display: inline-flex; position: relative; z-index: 10;&quot;</span>&gt;&lt;/CopyLLMTxtMenu&gt;

                <span class="hljs-comment"># No metadata - we don&#x27;t want to render this in UI</span>
            )
        ]<!----></pre></div><!----> <p>UI 구성에 대한 완전한 제어를 위해 <code>MellonParam</code> 인스턴스를 직접 전달합니다:</p> <div class="code-block relative "><div class="absolute top-2.5 right-4"><button class="inline-flex items-center relative text-sm focus:text-green-500 cursor-pointer focus:outline-none transition duration-200 ease-in-out opacity-0 mx-0.5   text-gray-600  " title="code excerpt" type="button"><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" fill="currentColor" focusable="false" role="img" width="1em" height="1em" preserveAspectRatio="xMidYMid meet" viewBox="0 0 32 32"><path d="M28,10V28H10V10H28m0-2H10a2,2,0,0,0-2,2V28a2,2,0,0,0,2,2H28a2,2,0,0,0,2-2V10a2,2,0,0,0-2-2Z" transform="translate(0)"></path><path d="M4,18H2V4A2,2,0,0,1,4,2H18V4H4Z" transform="translate(0)"></path><rect fill="none" width="32" height="32"></rect></svg><!----> <div class=" absolute pointer-events-none transition-opacity bg-black text-white py-1 px-2 leading-tight rounded font-normal shadow left-1/2 top-full transform -translate-x-1/2 translate-y-2 opacity-0 "><div class="absolute bottom-full left-1/2 transform -translate-x-1/2 w-0 h-0 border-black border-4 border-t-0" style="border-left-color: transparent; border-right-color: transparent;"></div> 복사됨</div><!----></button><!----></div> <pre class="language-python "><!----><span class="hljs-keyword">from</span> diffusers.modular_pipelines.mellon_node_utils <span class="hljs-keyword">import</span> MellonParam

InputParam(
    <span class="hljs-string">&quot;mode&quot;</span>,
    type_hint=<span class="hljs-built_in">str</span>,
    default=<span class="hljs-string">&quot;balanced&quot;</span>,
    metadata={<span class="hljs-string">&quot;mellon&quot;</span>: MellonParam.Input.dropdown(<span class="hljs-string">&quot;mode&quot;</span>, options=[<span class="hljs-string">&quot;fast&quot;</span>, <span class="hljs-string">&quot;balanced&quot;</span>, <span class="hljs-string">&quot;quality&quot;</span>])},
)<!----></pre></div><!----> <!--[2--><h3 class="relative group"><a id="using-inputtypes-and-outputtypes-when-generating-config" class="header-link block pr-1.5 text-lg no-hover:hidden with-hover:absolute with-hover:p-1.5 with-hover:opacity-0 with-hover:group-hover:opacity-100 with-hover:right-full" href="#using-inputtypes-and-outputtypes-when-generating-config"><span><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 256"><path d="M167.594 88.393a8.001 8.001 0 0 1 0 11.314l-67.882 67.882a8 8 0 1 1-11.314-11.315l67.882-67.881a8.003 8.003 0 0 1 11.314 0zm-28.287 84.86l-28.284 28.284a40 40 0 0 1-56.567-56.567l28.284-28.284a8 8 0 0 0-11.315-11.315l-28.284 28.284a56 56 0 0 0 79.196 79.197l28.285-28.285a8 8 0 1 0-11.315-11.314zM212.852 43.14a56.002 56.002 0 0 0-79.196 0l-28.284 28.284a8 8 0 1 0 11.314 11.314l28.284-28.284a40 40 0 0 1 56.568 56.567l-28.285 28.285a8 8 0 0 0 11.315 11.314l28.284-28.284a56.065 56.065 0 0 0 0-79.196z" fill="currentColor"></path></svg><!----></span></a> <span><!---->input_types와 output_types를 사용하여 설정 생성<!----></span></h3><!--]--><!----> <p>기존 파이프라인을 사용 중이거나 블록 정의를 깔끔하게 유지하려면, <code>input_types/output_types</code> 인수를 사용하여 설정을 생성할 때 유형을 지정하세요:</p> <div class="code-block relative "><div class="absolute top-2.5 right-4"><button class="inline-flex items-center relative text-sm focus:text-green-500 cursor-pointer focus:outline-none transition duration-200 ease-in-out opacity-0 mx-0.5   text-gray-600  " title="code excerpt" type="button"><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" fill="currentColor" focusable="false" role="img" width="1em" height="1em" preserveAspectRatio="xMidYMid meet" viewBox="0 0 32 32"><path d="M28,10V28H10V10H28m0-2H10a2,2,0,0,0-2,2V28a2,2,0,0,0,2,2H28a2,2,0,0,0,2-2V10a2,2,0,0,0-2-2Z" transform="translate(0)"></path><path d="M4,18H2V4A2,2,0,0,1,4,2H18V4H4Z" transform="translate(0)"></path><rect fill="none" width="32" height="32"></rect></svg><!----> <div class=" absolute pointer-events-none transition-opacity bg-black text-white py-1 px-2 leading-tight rounded font-normal shadow left-1/2 top-full transform -translate-x-1/2 translate-y-2 opacity-0 "><div class="absolute bottom-full left-1/2 transform -translate-x-1/2 w-0 h-0 border-black border-4 border-t-0" style="border-left-color: transparent; border-right-color: transparent;"></div> 복사됨</div><!----></button><!----></div> <pre class="language-python "><!----><span class="hljs-keyword">from</span> diffusers.modular_pipelines.mellon_node_utils <span class="hljs-keyword">import</span> MellonPipelineConfig

mellon_config = MellonPipelineConfig.from_custom_block(
    blocks,
    input_types={<span class="hljs-string">&quot;prompt&quot;</span>: <span class="hljs-string">&quot;textbox&quot;</span>},
    output_types={<span class="hljs-string">&quot;prompt&quot;</span>: <span class="hljs-string">&quot;text&quot;</span>}
)<!----></pre></div><!----> <blockquote class="note"><p><code>metadata</code>와 <code>input_types</code>/<code>output_types</code>가 모두 지정된 경우, 인수가 <code>metadata</code>를 덮어씁니다.</p></blockquote> <!--[1--><h2 class="relative group"><a id="generate-and-push-the-mellon-config" class="header-link block pr-1.5 text-lg no-hover:hidden with-hover:absolute with-hover:p-1.5 with-hover:opacity-0 with-hover:group-hover:opacity-100 with-hover:right-full" href="#generate-and-push-the-mellon-config"><span><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 256"><path d="M167.594 88.393a8.001 8.001 0 0 1 0 11.314l-67.882 67.882a8 8 0 1 1-11.314-11.315l67.882-67.881a8.003 8.003 0 0 1 11.314 0zm-28.287 84.86l-28.284 28.284a40 40 0 0 1-56.567-56.567l28.284-28.284a8 8 0 0 0-11.315-11.315l-28.284 28.284a56 56 0 0 0 79.196 79.197l28.285-28.285a8 8 0 1 0-11.315-11.314zM212.852 43.14a56.002 56.002 0 0 0-79.196 0l-28.284 28.284a8 8 0 1 0 11.314 11.314l28.284-28.284a40 40 0 0 1 56.568 56.567l-28.285 28.285a8 8 0 0 0 11.315 11.314l28.284-28.284a56.065 56.065 0 0 0 0-79.196z" fill="currentColor"></path></svg><!----></span></a> <span><!---->Mellon 설정을 생성하고 push합니다<!----></span></h2><!--]--><!----> <p>블록에 메타데이터를 추가한 후, 기본 Mellon 구성 템플릿을 생성하여 Hub에 push합니다:</p> <div class="code-block relative "><div class="absolute top-2.5 right-4"><button class="inline-flex items-center relative text-sm focus:text-green-500 cursor-pointer focus:outline-none transition duration-200 ease-in-out opacity-0 mx-0.5   text-gray-600  " title="code excerpt" type="button"><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" fill="currentColor" focusable="false" role="img" width="1em" height="1em" preserveAspectRatio="xMidYMid meet" viewBox="0 0 32 32"><path d="M28,10V28H10V10H28m0-2H10a2,2,0,0,0-2,2V28a2,2,0,0,0,2,2H28a2,2,0,0,0,2-2V10a2,2,0,0,0-2-2Z" transform="translate(0)"></path><path d="M4,18H2V4A2,2,0,0,1,4,2H18V4H4Z" transform="translate(0)"></path><rect fill="none" width="32" height="32"></rect></svg><!----> <div class=" absolute pointer-events-none transition-opacity bg-black text-white py-1 px-2 leading-tight rounded font-normal shadow left-1/2 top-full transform -translate-x-1/2 translate-y-2 opacity-0 "><div class="absolute bottom-full left-1/2 transform -translate-x-1/2 w-0 h-0 border-black border-4 border-t-0" style="border-left-color: transparent; border-right-color: transparent;"></div> 복사됨</div><!----></button><!----></div> <pre class="language-python "><!----><span class="hljs-keyword">from</span> diffusers <span class="hljs-keyword">import</span> ModularPipelineBlocks
<span class="hljs-keyword">from</span> diffusers.modular_pipelines.mellon_node_utils <span class="hljs-keyword">import</span> MellonPipelineConfig

<span class="hljs-comment"># load your custom blocks from your local dir</span>
blocks = ModularPipelineBlocks.from_pretrained(<span class="hljs-string">&quot;/path/local/folder&quot;</span>, trust_remote_code=<span class="hljs-literal">True</span>)

<span class="hljs-comment"># Generate the default config template</span>
mellon_config = MellonPipelineConfig.from_custom_block(blocks)
<span class="hljs-comment"># push the default template to `repo_id`, you will need to pass the same local folder path so that it will save the config locally first</span>
mellon_config.save(
    local_dir=<span class="hljs-string">&quot;/path/local/folder&quot;</span>,
    repo_id= repo_id,
    push_to_hub=<span class="hljs-literal">True</span>
)<!----></pre></div><!----> <p>이 작업은 저장소에 <code>mellon_pipeline_config.json</code> 파일을 생성합니다.</p> <!--[1--><h2 class="relative group"><a id="review-and-adjust-the-config" class="header-link block pr-1.5 text-lg no-hover:hidden with-hover:absolute with-hover:p-1.5 with-hover:opacity-0 with-hover:group-hover:opacity-100 with-hover:right-full" href="#review-and-adjust-the-config"><span><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 256"><path d="M167.594 88.393a8.001 8.001 0 0 1 0 11.314l-67.882 67.882a8 8 0 1 1-11.314-11.315l67.882-67.881a8.003 8.003 0 0 1 11.314 0zm-28.287 84.86l-28.284 28.284a40 40 0 0 1-56.567-56.567l28.284-28.284a8 8 0 0 0-11.315-11.315l-28.284 28.284a56 56 0 0 0 79.196 79.197l28.285-28.285a8 8 0 1 0-11.315-11.314zM212.852 43.14a56.002 56.002 0 0 0-79.196 0l-28.284 28.284a8 8 0 1 0 11.314 11.314l28.284-28.284a40 40 0 0 1 56.568 56.567l-28.285 28.285a8 8 0 0 0 11.315 11.314l28.284-28.284a56.065 56.065 0 0 0 0-79.196z" fill="currentColor"></path></svg><!----></span></a> <span><!---->config 검토 및 조정<!----></span></h2><!--]--><!----> <p>생성된 템플릿은 시작점일 뿐이며, 필요에 맞게 조정할 수 있습니다. Gemini Prompt Expander의 생성된 설정을 함께 살펴보겠습니다:</p> <div class="code-block relative "><div class="absolute top-2.5 right-4"><button class="inline-flex items-center relative text-sm focus:text-green-500 cursor-pointer focus:outline-none transition duration-200 ease-in-out opacity-0 mx-0.5   text-gray-600  " title="code excerpt" type="button"><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" fill="currentColor" focusable="false" role="img" width="1em" height="1em" preserveAspectRatio="xMidYMid meet" viewBox="0 0 32 32"><path d="M28,10V28H10V10H28m0-2H10a2,2,0,0,0-2,2V28a2,2,0,0,0,2,2H28a2,2,0,0,0,2-2V10a2,2,0,0,0-2-2Z" transform="translate(0)"></path><path d="M4,18H2V4A2,2,0,0,1,4,2H18V4H4Z" transform="translate(0)"></path><rect fill="none" width="32" height="32"></rect></svg><!----> <div class=" absolute pointer-events-none transition-opacity bg-black text-white py-1 px-2 leading-tight rounded font-normal shadow left-1/2 top-full transform -translate-x-1/2 translate-y-2 opacity-0 "><div class="absolute bottom-full left-1/2 transform -translate-x-1/2 w-0 h-0 border-black border-4 border-t-0" style="border-left-color: transparent; border-right-color: transparent;"></div> 복사됨</div><!----></button><!----></div> <pre class="language-json "><!----><span class="hljs-punctuation">{</span>
  <span class="hljs-attr">&quot;label&quot;</span><span class="hljs-punctuation">:</span> <span class="hljs-string">&quot;Gemini Prompt Expander&quot;</span><span class="hljs-punctuation">,</span>
  <span class="hljs-attr">&quot;default_repo&quot;</span><span class="hljs-punctuation">:</span> <span class="hljs-string">&quot;&quot;</span><span class="hljs-punctuation">,</span>
  <span class="hljs-attr">&quot;default_dtype&quot;</span><span class="hljs-punctuation">:</span> <span class="hljs-string">&quot;&quot;</span><span class="hljs-punctuation">,</span>
  <span class="hljs-attr">&quot;node_params&quot;</span><span class="hljs-punctuation">:</span> <span class="hljs-punctuation">{</span>
    <span class="hljs-attr">&quot;custom&quot;</span><span class="hljs-punctuation">:</span> <span class="hljs-punctuation">{</span>
      <span class="hljs-attr">&quot;params&quot;</span><span class="hljs-punctuation">:</span> <span class="hljs-punctuation">{</span>
        <span class="hljs-attr">&quot;prompt&quot;</span><span class="hljs-punctuation">:</span> <span class="hljs-punctuation">{</span>
          <span class="hljs-attr">&quot;label&quot;</span><span class="hljs-punctuation">:</span> <span class="hljs-string">&quot;Prompt&quot;</span><span class="hljs-punctuation">,</span>
          <span class="hljs-attr">&quot;type&quot;</span><span class="hljs-punctuation">:</span> <span class="hljs-string">&quot;string&quot;</span><span class="hljs-punctuation">,</span>
          <span class="hljs-attr">&quot;display&quot;</span><span class="hljs-punctuation">:</span> <span class="hljs-string">&quot;textarea&quot;</span><span class="hljs-punctuation">,</span>
          <span class="hljs-attr">&quot;default&quot;</span><span class="hljs-punctuation">:</span> <span class="hljs-string">&quot;&quot;</span>
        <span class="hljs-punctuation">}</span><span class="hljs-punctuation">,</span>
        <span class="hljs-attr">&quot;out_prompt&quot;</span><span class="hljs-punctuation">:</span> <span class="hljs-punctuation">{</span>
          <span class="hljs-attr">&quot;label&quot;</span><span class="hljs-punctuation">:</span> <span class="hljs-string">&quot;Prompt&quot;</span><span class="hljs-punctuation">,</span>
          <span class="hljs-attr">&quot;type&quot;</span><span class="hljs-punctuation">:</span> <span class="hljs-string">&quot;string&quot;</span><span class="hljs-punctuation">,</span>
          <span class="hljs-attr">&quot;display&quot;</span><span class="hljs-punctuation">:</span> <span class="hljs-string">&quot;output&quot;</span>
        <span class="hljs-punctuation">}</span><span class="hljs-punctuation">,</span>
        <span class="hljs-attr">&quot;old_prompt&quot;</span><span class="hljs-punctuation">:</span> <span class="hljs-punctuation">{</span>
          <span class="hljs-attr">&quot;label&quot;</span><span class="hljs-punctuation">:</span> <span class="hljs-string">&quot;Old Prompt&quot;</span><span class="hljs-punctuation">,</span>
          <span class="hljs-attr">&quot;type&quot;</span><span class="hljs-punctuation">:</span> <span class="hljs-string">&quot;custom&quot;</span><span class="hljs-punctuation">,</span>
          <span class="hljs-attr">&quot;display&quot;</span><span class="hljs-punctuation">:</span> <span class="hljs-string">&quot;output&quot;</span>
        <span class="hljs-punctuation">}</span><span class="hljs-punctuation">,</span>
        <span class="hljs-attr">&quot;doc&quot;</span><span class="hljs-punctuation">:</span> <span class="hljs-punctuation">{</span>
          <span class="hljs-attr">&quot;label&quot;</span><span class="hljs-punctuation">:</span> <span class="hljs-string">&quot;Doc&quot;</span><span class="hljs-punctuation">,</span>
          <span class="hljs-attr">&quot;type&quot;</span><span class="hljs-punctuation">:</span> <span class="hljs-string">&quot;string&quot;</span><span class="hljs-punctuation">,</span>
          <span class="hljs-attr">&quot;display&quot;</span><span class="hljs-punctuation">:</span> <span class="hljs-string">&quot;output&quot;</span>
        <span class="hljs-punctuation">}</span>
      <span class="hljs-punctuation">}</span><span class="hljs-punctuation">,</span>
      <span class="hljs-attr">&quot;input_names&quot;</span><span class="hljs-punctuation">:</span> <span class="hljs-punctuation">[</span><span class="hljs-string">&quot;prompt&quot;</span><span class="hljs-punctuation">]</span><span class="hljs-punctuation">,</span>
      <span class="hljs-attr">&quot;model_input_names&quot;</span><span class="hljs-punctuation">:</span> <span class="hljs-punctuation">[</span><span class="hljs-punctuation">]</span><span class="hljs-punctuation">,</span>
      <span class="hljs-attr">&quot;output_names&quot;</span><span class="hljs-punctuation">:</span> <span class="hljs-punctuation">[</span><span class="hljs-string">&quot;out_prompt&quot;</span><span class="hljs-punctuation">,</span> <span class="hljs-string">&quot;old_prompt&quot;</span><span class="hljs-punctuation">,</span> <span class="hljs-string">&quot;doc&quot;</span><span class="hljs-punctuation">]</span><span class="hljs-punctuation">,</span>
      <span class="hljs-attr">&quot;block_name&quot;</span><span class="hljs-punctuation">:</span> <span class="hljs-string">&quot;custom&quot;</span><span class="hljs-punctuation">,</span>
      <span class="hljs-attr">&quot;node_type&quot;</span><span class="hljs-punctuation">:</span> <span class="hljs-string">&quot;custom&quot;</span>
    <span class="hljs-punctuation">}</span>
  <span class="hljs-punctuation">}</span>
<span class="hljs-punctuation">}</span><!----></pre></div><!----> <!--[2--><h3 class="relative group"><a id="understanding-the-structure" class="header-link block pr-1.5 text-lg no-hover:hidden with-hover:absolute with-hover:p-1.5 with-hover:opacity-0 with-hover:group-hover:opacity-100 with-hover:right-full" href="#understanding-the-structure"><span><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 256"><path d="M167.594 88.393a8.001 8.001 0 0 1 0 11.314l-67.882 67.882a8 8 0 1 1-11.314-11.315l67.882-67.881a8.003 8.003 0 0 1 11.314 0zm-28.287 84.86l-28.284 28.284a40 40 0 0 1-56.567-56.567l28.284-28.284a8 8 0 0 0-11.315-11.315l-28.284 28.284a56 56 0 0 0 79.196 79.197l28.285-28.285a8 8 0 1 0-11.315-11.314zM212.852 43.14a56.002 56.002 0 0 0-79.196 0l-28.284 28.284a8 8 0 1 0 11.314 11.314l28.284-28.284a40 40 0 0 1 56.568 56.567l-28.285 28.285a8 8 0 0 0 11.315 11.314l28.284-28.284a56.065 56.065 0 0 0 0-79.196z" fill="currentColor"></path></svg><!----></span></a> <span><!---->구조 이해하기<!----></span></h3><!--]--><!----> <p><code>params</code> 딕셔너리는 각 UI 요소가 어떻게 렌더링되는지 정의합니다. <code>input_names</code>, <code>model_input_names</code>, <code>output_names</code> 목록은 이러한 UI 요소를 <a href="/docs/diffusers/main/ko/api/modular_diffusers/pipeline_blocks#diffusers.ModularPipelineBlocks">ModularPipelineBlocks</a>의 I/O 인터페이스에 매핑합니다:</p> <table><thead><tr><th>Mellon 설정</th><th>ModularPipelineBlocks</th></tr></thead><tbody><tr><td><code>input_names</code></td><td><code>inputs</code> 속성</td></tr><tr><td><code>model_input_names</code></td><td><code>expected_components</code> 속성</td></tr><tr><td><code>output_names</code></td><td><code>intermediate_outputs</code> 속성</td></tr></tbody></table> <p>이 예시에서: <code>prompt</code>가 유일한 입력입니다. 모델 구성 요소는 없으며, 출력에는 <code>out_prompt</code>, <code>old_prompt</code>, <code>doc</code>가 포함됩니다.</p> <p>이제 <code>params</code> 딕셔너리를 살펴보겠습니다:</p> <ul><li><p><strong><code>prompt</code></strong>: <code>display: "textarea"</code> (텍스트 입력 박스로 렌더링됨), <code>label: "Prompt"</code> (UI에 표시됨), <code>default: ""</code> (빈 상태로 시작)를 가진 입력 매개변수입니다. <code>type: "string"</code> 필드는 Mellon에서 중요합니다. 어떤 노드끼리 연결될 수 있는지를 결정하기 때문입니다. 동일한 타입끼리만 “noodles”로 연결할 수 있습니다.</p></li> <li><p><strong><code>out_prompt</code></strong>: 확장된 프롬프트 출력입니다. 입력과 출력이 동일한 이름(<code>prompt</code>)을 공유하므로 설정에서 이름 충돌을 피하기 위해 <code>out_</code> 접두사가 자동으로 추가되었습니다. <code>display: "output"</code>를 가지고 있어 출력 소켓으로 렌더링됩니다.</p></li> <li><p><strong><code>old_prompt</code></strong>: 메타데이터를 지정하지 않았기 때문에 <code>type: "custom"</code>입니다. UI에서는 단순한 점으로 표시됩니다. 실제로 UI에 노출할 의도가 없으므로 제거할 수 있습니다.</p></li> <li><p><strong><code>doc</code></strong>: 문서 출력으로, 모든 커스텀 블록에 자동으로 추가됩니다.</p></li></ul> <!--[2--><h3 class="relative group"><a id="making-adjustments" class="header-link block pr-1.5 text-lg no-hover:hidden with-hover:absolute with-hover:p-1.5 with-hover:opacity-0 with-hover:group-hover:opacity-100 with-hover:right-full" href="#making-adjustments"><span><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 256"><path d="M167.594 88.393a8.001 8.001 0 0 1 0 11.314l-67.882 67.882a8 8 0 1 1-11.314-11.315l67.882-67.881a8.003 8.003 0 0 1 11.314 0zm-28.287 84.86l-28.284 28.284a40 40 0 0 1-56.567-56.567l28.284-28.284a8 8 0 0 0-11.315-11.315l-28.284 28.284a56 56 0 0 0 79.196 79.197l28.285-28.285a8 8 0 1 0-11.315-11.314zM212.852 43.14a56.002 56.002 0 0 0-79.196 0l-28.284 28.284a8 8 0 1 0 11.314 11.314l28.284-28.284a40 40 0 0 1 56.568 56.567l-28.285 28.285a8 8 0 0 0 11.315 11.314l28.284-28.284a56.065 56.065 0 0 0 0-79.196z" fill="currentColor"></path></svg><!----></span></a> <span><!---->조절하기<!----></span></h3><!--]--><!----> <p>더 이상 사용하지 않으므로 <code>old_prompt</code>를 <code>params</code>와 <code>output_names</code> 양쪽에서 제거하세요.</p> <div class="code-block relative "><div class="absolute top-2.5 right-4"><button class="inline-flex items-center relative text-sm focus:text-green-500 cursor-pointer focus:outline-none transition duration-200 ease-in-out opacity-0 mx-0.5   text-gray-600  " title="code excerpt" type="button"><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" fill="currentColor" focusable="false" role="img" width="1em" height="1em" preserveAspectRatio="xMidYMid meet" viewBox="0 0 32 32"><path d="M28,10V28H10V10H28m0-2H10a2,2,0,0,0-2,2V28a2,2,0,0,0,2,2H28a2,2,0,0,0,2-2V10a2,2,0,0,0-2-2Z" transform="translate(0)"></path><path d="M4,18H2V4A2,2,0,0,1,4,2H18V4H4Z" transform="translate(0)"></path><rect fill="none" width="32" height="32"></rect></svg><!----> <div class=" absolute pointer-events-none transition-opacity bg-black text-white py-1 px-2 leading-tight rounded font-normal shadow left-1/2 top-full transform -translate-x-1/2 translate-y-2 opacity-0 "><div class="absolute bottom-full left-1/2 transform -translate-x-1/2 w-0 h-0 border-black border-4 border-t-0" style="border-left-color: transparent; border-right-color: transparent;"></div> 복사됨</div><!----></button><!----></div> <pre class="language-json "><!----><span class="hljs-punctuation">{</span>
  <span class="hljs-attr">&quot;label&quot;</span><span class="hljs-punctuation">:</span> <span class="hljs-string">&quot;Gemini Prompt Expander&quot;</span><span class="hljs-punctuation">,</span>
  <span class="hljs-attr">&quot;default_repo&quot;</span><span class="hljs-punctuation">:</span> <span class="hljs-string">&quot;&quot;</span><span class="hljs-punctuation">,</span>
  <span class="hljs-attr">&quot;default_dtype&quot;</span><span class="hljs-punctuation">:</span> <span class="hljs-string">&quot;&quot;</span><span class="hljs-punctuation">,</span>
  <span class="hljs-attr">&quot;node_params&quot;</span><span class="hljs-punctuation">:</span> <span class="hljs-punctuation">{</span>
    <span class="hljs-attr">&quot;custom&quot;</span><span class="hljs-punctuation">:</span> <span class="hljs-punctuation">{</span>
      <span class="hljs-attr">&quot;params&quot;</span><span class="hljs-punctuation">:</span> <span class="hljs-punctuation">{</span>
        <span class="hljs-attr">&quot;prompt&quot;</span><span class="hljs-punctuation">:</span> <span class="hljs-punctuation">{</span>
          <span class="hljs-attr">&quot;label&quot;</span><span class="hljs-punctuation">:</span> <span class="hljs-string">&quot;Prompt&quot;</span><span class="hljs-punctuation">,</span>
          <span class="hljs-attr">&quot;type&quot;</span><span class="hljs-punctuation">:</span> <span class="hljs-string">&quot;string&quot;</span><span class="hljs-punctuation">,</span>
          <span class="hljs-attr">&quot;display&quot;</span><span class="hljs-punctuation">:</span> <span class="hljs-string">&quot;textarea&quot;</span><span class="hljs-punctuation">,</span>
          <span class="hljs-attr">&quot;default&quot;</span><span class="hljs-punctuation">:</span> <span class="hljs-string">&quot;&quot;</span>
        <span class="hljs-punctuation">}</span><span class="hljs-punctuation">,</span>
        <span class="hljs-attr">&quot;out_prompt&quot;</span><span class="hljs-punctuation">:</span> <span class="hljs-punctuation">{</span>
          <span class="hljs-attr">&quot;label&quot;</span><span class="hljs-punctuation">:</span> <span class="hljs-string">&quot;Prompt&quot;</span><span class="hljs-punctuation">,</span>
          <span class="hljs-attr">&quot;type&quot;</span><span class="hljs-punctuation">:</span> <span class="hljs-string">&quot;string&quot;</span><span class="hljs-punctuation">,</span>
          <span class="hljs-attr">&quot;display&quot;</span><span class="hljs-punctuation">:</span> <span class="hljs-string">&quot;output&quot;</span>
        <span class="hljs-punctuation">}</span><span class="hljs-punctuation">,</span>
        <span class="hljs-attr">&quot;doc&quot;</span><span class="hljs-punctuation">:</span> <span class="hljs-punctuation">{</span>
          <span class="hljs-attr">&quot;label&quot;</span><span class="hljs-punctuation">:</span> <span class="hljs-string">&quot;Doc&quot;</span><span class="hljs-punctuation">,</span>
          <span class="hljs-attr">&quot;type&quot;</span><span class="hljs-punctuation">:</span> <span class="hljs-string">&quot;string&quot;</span><span class="hljs-punctuation">,</span>
          <span class="hljs-attr">&quot;display&quot;</span><span class="hljs-punctuation">:</span> <span class="hljs-string">&quot;output&quot;</span>
        <span class="hljs-punctuation">}</span>
      <span class="hljs-punctuation">}</span><span class="hljs-punctuation">,</span>
      <span class="hljs-attr">&quot;input_names&quot;</span><span class="hljs-punctuation">:</span> <span class="hljs-punctuation">[</span><span class="hljs-string">&quot;prompt&quot;</span><span class="hljs-punctuation">]</span><span class="hljs-punctuation">,</span>
      <span class="hljs-attr">&quot;model_input_names&quot;</span><span class="hljs-punctuation">:</span> <span class="hljs-punctuation">[</span><span class="hljs-punctuation">]</span><span class="hljs-punctuation">,</span>
      <span class="hljs-attr">&quot;output_names&quot;</span><span class="hljs-punctuation">:</span> <span class="hljs-punctuation">[</span><span class="hljs-string">&quot;out_prompt&quot;</span><span class="hljs-punctuation">,</span> <span class="hljs-string">&quot;doc&quot;</span><span class="hljs-punctuation">]</span><span class="hljs-punctuation">,</span>
      <span class="hljs-attr">&quot;block_name&quot;</span><span class="hljs-punctuation">:</span> <span class="hljs-string">&quot;custom&quot;</span><span class="hljs-punctuation">,</span>
      <span class="hljs-attr">&quot;node_type&quot;</span><span class="hljs-punctuation">:</span> <span class="hljs-string">&quot;custom&quot;</span>
    <span class="hljs-punctuation">}</span>
  <span class="hljs-punctuation">}</span>
<span class="hljs-punctuation">}</span><!----></pre></div><!----> <p>최종 설정은 <a href="https://huggingface.co/diffusers/gemini-prompt-expander-mellon" rel="nofollow">diffusers/gemini-prompt-expander-mellon</a>에서 확인하세요.</p> <a class="!text-gray-400 !no-underline text-sm flex items-center not-prose mt-4" href="https://github.com/huggingface/diffusers/blob/main/docs/source/en/modular_diffusers/mellon.md" target="_blank"><svg class="mr-1" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" fill="currentColor" focusable="false" role="img" width="1em" height="1em" preserveAspectRatio="xMidYMid meet" viewBox="0 0 32 32"><path d="M31,16l-7,7l-1.41-1.41L28.17,16l-5.58-5.59L24,9l7,7z"></path><path d="M1,16l7-7l1.41,1.41L3.83,16l5.58,5.59L8,23l-7-7z"></path><path d="M12.419,25.484L17.639,6.552l1.932,0.518L14.351,26.002z"></path></svg><!----> <span><span class="underline">Update</span> on GitHub</span></a><!----> <p></p><!--]--><!----><!--]--><!--]--><!--]--> <!--[-1--><!--]--><!--]-->
			
			<script>
				{
					__sveltekit_1rjuniz = {
						base: "/docs/diffusers/main/en",
						assets: "/docs/diffusers/main/en"
					};
					const element = document.currentScript.parentElement;
					Promise.all([
						import("/docs/diffusers/main/en/_app/immutable/entry/start.vZc-dOUR.js"),
						import("/docs/diffusers/main/en/_app/immutable/entry/app.B6c3Ml05.js")
					]).then(([kit, app]) => {
						kit.start(app, element, {
							node_ids: [0, 319],
							data: [null,null],
							form: null,
							error: null
						});
					});
				}
			</script>
		

Xet Storage Details

Size:: 45 kB
Xet hash:: 11623e45acc0000a85a7d4f6021e605a844b4195818e6da8f18a91a753b700b4

Xet efficiently stores files, intelligently splitting them into unique chunks and accelerating uploads and downloads. More info.

	<meta charset="utf-8" /><meta name="hf:doc:metadata" content="{"title":"Mellon에서 사용자 정의 블록 사용","local":"using-custom-blocks-with-mellon","sections":[],"depth":2}"/>
	<link href="/docs/diffusers/main/en/_app/immutable/entry/start.vZc-dOUR.js" rel="modulepreload">
	<link href="/docs/diffusers/main/en/_app/immutable/chunks/Bafuik5c.js" rel="modulepreload">
	<link href="/docs/diffusers/main/en/_app/immutable/chunks/Bupkjr9f.js" rel="modulepreload">
	<link href="/docs/diffusers/main/en/_app/immutable/entry/app.B6c3Ml05.js" rel="modulepreload">
	<link href="/docs/diffusers/main/en/_app/immutable/chunks/CyvZ3FS5.js" rel="modulepreload">
	<link href="/docs/diffusers/main/en/_app/immutable/chunks/l0QnnOED.js" rel="modulepreload">
	<link href="/docs/diffusers/main/en/_app/immutable/chunks/DnVIJfC5.js" rel="modulepreload">
	<link href="/docs/diffusers/main/en/_app/immutable/chunks/DsnmJJEf.js" rel="modulepreload">
	<link href="/docs/diffusers/main/en/_app/immutable/nodes/0.BQlx092V.js" rel="modulepreload">
	<link href="/docs/diffusers/main/en/_app/immutable/chunks/CoSrdQax.js" rel="modulepreload">
	<link href="/docs/diffusers/main/en/_app/immutable/nodes/319.9CNMHFHT.js" rel="modulepreload">
	<link href="/docs/diffusers/main/en/_app/immutable/chunks/B4AMoTAu.js" rel="modulepreload">
	<!--1gvor5n--><meta name="hf:doc:metadata" content="{"title":"Using Custom Blocks with Mellon","local":"using-custom-blocks-with-mellon","sections":[],"depth":2}"/><!---->
	<link href="/docs/diffusers/main/en/_app/immutable/assets/0.tn0RQdqM.css" rel="modulepreload"> <!--[--><!--[0--><!--[--><!--[0--><!--[--><p></p> <!--[1--><h2 class="relative group"><a id="using-custom-blocks-with-mellon" class="header-link block pr-1.5 text-lg no-hover:hidden with-hover:absolute with-hover:p-1.5 with-hover:opacity-0 with-hover:group-hover:opacity-100 with-hover:right-full" href="#using-custom-blocks-with-mellon"><span><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 256"><path d="M167.594 88.393a8.001 8.001 0 0 1 0 11.314l-67.882 67.882a8 8 0 1 1-11.314-11.315l67.882-67.881a8.003 8.003 0 0 1 11.314 0zm-28.287 84.86l-28.284 28.284a40 40 0 0 1-56.567-56.567l28.284-28.284a8 8 0 0 0-11.315-11.315l-28.284 28.284a56 56 0 0 0 79.196 79.197l28.285-28.285a8 8 0 1 0-11.315-11.314zM212.852 43.14a56.002 56.002 0 0 0-79.196 0l-28.284 28.284a8 8 0 1 0 11.314 11.314l28.284-28.284a40 40 0 0 1 56.568 56.567l-28.285 28.285a8 8 0 0 0 11.315 11.314l28.284-28.284a56.065 56.065 0 0 0 0-79.196z" fill="currentColor"></path></svg><!----></span></a> <span><!---->Mellon에서 사용자 정의 블록 사용<!----></span></h2><!--]--><!----> <p><a href="https://github.com/cubiq/Mellon" rel="nofollow">Mellon</a>은 Modular Diffusers와 통합되는 시각적 워크플로 인터페이스로, 노드 기반 워크플로를 위해 설계되었습니다.</p> <blockquote class="warning"><p>Mellon은 초기 개발 단계에 있으며 아직 프로덕션 사용에 적합하지 않습니다. 이 내용을 통합이 어떻게 작동하는지에 대한 미리보기로 생각해 주세요!</p></blockquote> <p>Mellon에서는 커스텀 블록이 기본적으로 작동합니다 - 저장소에 <code>mellon_pipeline_config.json</code>만 추가하면 됩니다. 이 설정 파일은 Mellon이 블록의 매개변수를 UI 컴포넌트로 렌더링하는 방법을 알려줍니다.</p> <p><a href="https://huggingface.co/diffusers/gemini-prompt-expander-mellon" rel="nofollow">Gemini Prompt Expander</a> 블록을 사용한 실제 동작은 다음과 같습니다:</p> <p><img src="https://huggingface.co/datasets/huggingface/documentation-images/resolve/main/diffusers/modular_demo_dynamic.gif" alt="Mellon custom block demo"/></p> <p>Mellon에서 모듈형 diffusers 커스텀 블록을 사용하려면:</p> <ol><li>ModularDiffusers 섹션에서 <strong>Dynamic Block Node</strong>를 드래그합니다</li> <li><code>repo_id</code>를 입력하세요 (예: <code>diffusers/gemini-prompt-expander-mellon</code>)</li> <li><strong>커스텀 블록 로드</strong>를 클릭하세요</li> <li>노드는 블록의 입력과 출력을 표시하도록 변환됩니다</li></ol> <p>자신의 커스텀 블록에 이 설정을 만드는 방법을 단계별로 살펴보겠습니다.</p> <!--[1--><h2 class="relative group"><a id="steps-to-create-a-mellon-config" class="header-link block pr-1.5 text-lg no-hover:hidden with-hover:absolute with-hover:p-1.5 with-hover:opacity-0 with-hover:group-hover:opacity-100 with-hover:right-full" href="#steps-to-create-a-mellon-config"><span><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 256"><path d="M167.594 88.393a8.001 8.001 0 0 1 0 11.314l-67.882 67.882a8 8 0 1 1-11.314-11.315l67.882-67.881a8.003 8.003 0 0 1 11.314 0zm-28.287 84.86l-28.284 28.284a40 40 0 0 1-56.567-56.567l28.284-28.284a8 8 0 0 0-11.315-11.315l-28.284 28.284a56 56 0 0 0 79.196 79.197l28.285-28.285a8 8 0 1 0-11.315-11.314zM212.852 43.14a56.002 56.002 0 0 0-79.196 0l-28.284 28.284a8 8 0 1 0 11.314 11.314l28.284-28.284a40 40 0 0 1 56.568 56.567l-28.285 28.285a8 8 0 0 0 11.315 11.314l28.284-28.284a56.065 56.065 0 0 0 0-79.196z" fill="currentColor"></path></svg><!----></span></a> <span><!---->Mellon 설정을 만드는 단계<!----></span></h2><!--]--><!----> <ol><li><strong>파라미터에 Mellon 유형 지정</strong> - 각 <code>InputParam</code>/<code>OutputParam</code>에는 Mellon이 어떤 UI 컴포넌트를 렌더링할지 알려주는 유형(예: <code>"textbox"</code>, <code>"dropdown"</code>, <code>"image"</code>)이 필요합니다.</li> <li><strong><code>mellon_pipeline_config.json</code> 생성</strong> - 유틸리티를 사용하여 설정 템플릿을 생성하고 Hub 저장소에 푸시합니다.</li> <li><strong>(선택 사항) config 수동 조정</strong> - 특정 요구 사항에 맞게 생성된 config를 세밀하게 조정합니다.</li></ol> <!--[1--><h2 class="relative group"><a id="specify-mellon-types-for-parameters" class="header-link block pr-1.5 text-lg no-hover:hidden with-hover:absolute with-hover:p-1.5 with-hover:opacity-0 with-hover:group-hover:opacity-100 with-hover:right-full" href="#specify-mellon-types-for-parameters"><span><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 256"><path d="M167.594 88.393a8.001 8.001 0 0 1 0 11.314l-67.882 67.882a8 8 0 1 1-11.314-11.315l67.882-67.881a8.003 8.003 0 0 1 11.314 0zm-28.287 84.86l-28.284 28.284a40 40 0 0 1-56.567-56.567l28.284-28.284a8 8 0 0 0-11.315-11.315l-28.284 28.284a56 56 0 0 0 79.196 79.197l28.285-28.285a8 8 0 1 0-11.315-11.314zM212.852 43.14a56.002 56.002 0 0 0-79.196 0l-28.284 28.284a8 8 0 1 0 11.314 11.314l28.284-28.284a40 40 0 0 1 56.568 56.567l-28.285 28.285a8 8 0 0 0 11.315 11.314l28.284-28.284a56.065 56.065 0 0 0 0-79.196z" fill="currentColor"></path></svg><!----></span></a> <span><!---->매개변수에 대한 Mellon 유형 지정<!----></span></h2><!--]--><!----> <p>Mellon 타입은 각 파라미터가 UI에서 어떻게 렌더링되는지를 결정합니다. 파라미터의 타입을 지정하지 않으면 <code>"custom"</code>로 기본 설정되며, 이는 단순한 연결 점으로 렌더링됩니다. 생성된 config에서 나중에 언제든지 이 값을 조정할 수 있습니다.</p> <table><thead><tr><th>유형</th><th>입력/출력</th><th>설명</th></tr></thead><tbody><tr><td><code>image</code></td><td>둘 다</td><td>이미지 (PIL Image)</td></tr><tr><td><code>video</code></td><td>둘 다</td><td>Video</td></tr><tr><td><code>text</code></td><td>둘 다</td><td>텍스트 표시</td></tr><tr><td><code>textbox</code></td><td>입력</td><td>텍스트 입력</td></tr><tr><td><code>dropdown</code></td><td>입력</td><td>드롭다운 선택 메뉴</td></tr><tr><td><code>slider</code></td><td>입력</td><td>숫자 값을 위한 슬라이더</td></tr><tr><td><code>number</code></td><td>입력</td><td>숫자 입력</td></tr><tr><td><code>checkbox</code></td><td>입력</td><td>Boolean 토글</td></tr></tbody></table> <p>추가 구성이 필요한 파라미터(옵션이 있는 드롭다운, min/max 값이 있는 슬라이더 등)의 경우, 문자열 대신 <code>MellonParam</code> 인스턴스를 직접 전달합니다. 아래 클래스 메서드 중 하나를 사용하거나, <code>MellonParam(name, label, type, ...)</code>으로 완전히 사용자 정의된 인스턴스를 생성할 수 있습니다.</p> <table><thead><tr><th>메서드</th><th>설명</th></tr></thead><tbody><tr><td><code>MellonParam.Input.image(name)</code></td><td>이미지 입력</td></tr><tr><td><code>MellonParam.Input.textbox(name, default)</code></td><td>textarea로 텍스트 입력</td></tr><tr><td><code>MellonParam.Input.dropdown(name, options, default)</code></td><td>드롭다운 선택</td></tr><tr><td><code>MellonParam.Input.slider(name, default, min, max, step)</code></td><td>숫자 값을 위한 슬라이더</td></tr><tr><td><code>MellonParam.Input.number(name, default, min, max, step)</code></td><td>숫자 입력 (슬라이더 없음)</td></tr><tr><td><code>MellonParam.Input.seed(name, default)</code></td><td>randomize 버튼으로 시드 입력</td></tr><tr><td><code>MellonParam.Input.checkbox(name, default)</code></td><td>Boolean 체크박스</td></tr><tr><td><code>MellonParam.Input.model(name)</code></td><td>diffusers 구성 요소의 모델 입력</td></tr><tr><td><code>MellonParam.Output.image(name)</code></td><td>이미지 출력</td></tr><tr><td><code>MellonParam.Output.video(name)</code></td><td>비디오 출력</td></tr><tr><td><code>MellonParam.Output.text(name)</code></td><td>텍스트 출력</td></tr><tr><td><code>MellonParam.Output.model(name)</code></td><td>diffusers 구성 요소의 모델 출력</td></tr></tbody></table> <p>Mellon 유형을 지정하려면 아래 방법 중 하나를 선택하세요.</p> <!--[2--><h3 class="relative group"><a id="using-metadata-in-block-definitions" class="header-link block pr-1.5 text-lg no-hover:hidden with-hover:absolute with-hover:p-1.5 with-hover:opacity-0 with-hover:group-hover:opacity-100 with-hover:right-full" href="#using-metadata-in-block-definitions"><span><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 256"><path d="M167.594 88.393a8.001 8.001 0 0 1 0 11.314l-67.882 67.882a8 8 0 1 1-11.314-11.315l67.882-67.881a8.003 8.003 0 0 1 11.314 0zm-28.287 84.86l-28.284 28.284a40 40 0 0 1-56.567-56.567l28.284-28.284a8 8 0 0 0-11.315-11.315l-28.284 28.284a56 56 0 0 0 79.196 79.197l28.285-28.285a8 8 0 1 0-11.315-11.314zM212.852 43.14a56.002 56.002 0 0 0-79.196 0l-28.284 28.284a8 8 0 1 0 11.314 11.314l28.284-28.284a40 40 0 0 1 56.568 56.567l-28.285 28.285a8 8 0 0 0 11.315 11.314l28.284-28.284a56.065 56.065 0 0 0 0-79.196z" fill="currentColor"></path></svg><!----></span></a> <span><!---->블록 정의에서 메타데이터 사용<!----></span></h3><!--]--><!----> <p>사용자가 처음부터 커스텀 블록을 정의하는 경우, <code>metadata={"mellon": "<type>"}</code>을 <code>InputParam</code> 및 <code>OutputParam</code> 정의에 직접 추가하세요. Hub의 기존 커스텀 블록을 편집하는 경우, 로컬로 다운로드하는 방법은 <a href="./custom_blocks#editing-custom-blocks">커스텀 블록 편집</a>을 참고하세요.</p> <div class="code-block relative "><div class="absolute top-2.5 right-4"><button class="inline-flex items-center relative text-sm focus:text-green-500 cursor-pointer focus:outline-none transition duration-200 ease-in-out opacity-0 mx-0.5 text-gray-600 " title="code excerpt" type="button"><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" fill="currentColor" focusable="false" role="img" width="1em" height="1em" preserveAspectRatio="xMidYMid meet" viewBox="0 0 32 32"><path d="M28,10V28H10V10H28m0-2H10a2,2,0,0,0-2,2V28a2,2,0,0,0,2,2H28a2,2,0,0,0,2-2V10a2,2,0,0,0-2-2Z" transform="translate(0)"></path><path d="M4,18H2V4A2,2,0,0,1,4,2H18V4H4Z" transform="translate(0)"></path><rect fill="none" width="32" height="32"></rect></svg><!----> <div class=" absolute pointer-events-none transition-opacity bg-black text-white py-1 px-2 leading-tight rounded font-normal shadow left-1/2 top-full transform -translate-x-1/2 translate-y-2 opacity-0 "><div class="absolute bottom-full left-1/2 transform -translate-x-1/2 w-0 h-0 border-black border-4 border-t-0" style="border-left-color: transparent; border-right-color: transparent;"></div> 복사됨</div><!----></button><!----></div> <pre class="language-python "><!----><span class="hljs-keyword">class</span> <span class="hljs-title class_">GeminiPromptExpander</span>(<span class="hljs-title class_ inherited__">ModularPipelineBlocks</span>):

	<span class="hljs-meta"> @property</span>
	<span class="hljs-keyword">def</span> <span class="hljs-title function_">inputs</span>(<span class="hljs-params">self</span>) -> <span class="hljs-type">List</span>[InputParam]:
	<span class="hljs-keyword">return</span> [
	InputParam(
	<span class="hljs-string">"prompt"</span>,
	type_hint=<span class="hljs-built_in">str</span>,
	required=<span class="hljs-literal">True</span>,
	description=<span class="hljs-string">"Prompt to use"</span>,
	metadata={<span class="hljs-string">"mellon"</span>: <span class="hljs-string">"textbox"</span>}, <span class="hljs-comment"># Text input</span>
	)
	]

	<span class="hljs-meta"> @property</span>
	<span class="hljs-keyword">def</span> <span class="hljs-title function_">intermediate_outputs</span>(<span class="hljs-params">self</span>) -> <span class="hljs-type">List</span>[OutputParam]:
	<span class="hljs-keyword">return</span> [
	OutputParam(
	<span class="hljs-string">"prompt"</span>,
	type_hint=<span class="hljs-built_in">str</span>,
	description=<span class="hljs-string">"Expanded prompt by the LLM"</span>,
	metadata={<span class="hljs-string">"mellon"</span>: <span class="hljs-string">"text"</span>}, <span class="hljs-comment"># Text output</span>
	),
	OutputParam(
	<span class="hljs-string">"old_prompt"</span>,
	type_hint=<span class="hljs-built_in">str</span>,
	description=<span class="hljs-string">"Old prompt provided by the user"</span>,
	<CopyLLMTxtMenu containerStyle=<span class="hljs-string">"float: inline-end; margin-inline-start: 10px; display: inline-flex; position: relative; z-index: 10;"</span>></CopyLLMTxtMenu>

	<span class="hljs-comment"># No metadata - we don't want to render this in UI</span>
	)
	]<!----></pre></div><!----> <p>UI 구성에 대한 완전한 제어를 위해 <code>MellonParam</code> 인스턴스를 직접 전달합니다:</p> <div class="code-block relative "><div class="absolute top-2.5 right-4"><button class="inline-flex items-center relative text-sm focus:text-green-500 cursor-pointer focus:outline-none transition duration-200 ease-in-out opacity-0 mx-0.5 text-gray-600 " title="code excerpt" type="button"><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" fill="currentColor" focusable="false" role="img" width="1em" height="1em" preserveAspectRatio="xMidYMid meet" viewBox="0 0 32 32"><path d="M28,10V28H10V10H28m0-2H10a2,2,0,0,0-2,2V28a2,2,0,0,0,2,2H28a2,2,0,0,0,2-2V10a2,2,0,0,0-2-2Z" transform="translate(0)"></path><path d="M4,18H2V4A2,2,0,0,1,4,2H18V4H4Z" transform="translate(0)"></path><rect fill="none" width="32" height="32"></rect></svg><!----> <div class=" absolute pointer-events-none transition-opacity bg-black text-white py-1 px-2 leading-tight rounded font-normal shadow left-1/2 top-full transform -translate-x-1/2 translate-y-2 opacity-0 "><div class="absolute bottom-full left-1/2 transform -translate-x-1/2 w-0 h-0 border-black border-4 border-t-0" style="border-left-color: transparent; border-right-color: transparent;"></div> 복사됨</div><!----></button><!----></div> <pre class="language-python "><!----><span class="hljs-keyword">from</span> diffusers.modular_pipelines.mellon_node_utils <span class="hljs-keyword">import</span> MellonParam

	InputParam(
	<span class="hljs-string">"mode"</span>,
	type_hint=<span class="hljs-built_in">str</span>,
	default=<span class="hljs-string">"balanced"</span>,
	metadata={<span class="hljs-string">"mellon"</span>: MellonParam.Input.dropdown(<span class="hljs-string">"mode"</span>, options=[<span class="hljs-string">"fast"</span>, <span class="hljs-string">"balanced"</span>, <span class="hljs-string">"quality"</span>])},
	)<!----></pre></div><!----> <!--[2--><h3 class="relative group"><a id="using-inputtypes-and-outputtypes-when-generating-config" class="header-link block pr-1.5 text-lg no-hover:hidden with-hover:absolute with-hover:p-1.5 with-hover:opacity-0 with-hover:group-hover:opacity-100 with-hover:right-full" href="#using-inputtypes-and-outputtypes-when-generating-config"><span><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 256"><path d="M167.594 88.393a8.001 8.001 0 0 1 0 11.314l-67.882 67.882a8 8 0 1 1-11.314-11.315l67.882-67.881a8.003 8.003 0 0 1 11.314 0zm-28.287 84.86l-28.284 28.284a40 40 0 0 1-56.567-56.567l28.284-28.284a8 8 0 0 0-11.315-11.315l-28.284 28.284a56 56 0 0 0 79.196 79.197l28.285-28.285a8 8 0 1 0-11.315-11.314zM212.852 43.14a56.002 56.002 0 0 0-79.196 0l-28.284 28.284a8 8 0 1 0 11.314 11.314l28.284-28.284a40 40 0 0 1 56.568 56.567l-28.285 28.285a8 8 0 0 0 11.315 11.314l28.284-28.284a56.065 56.065 0 0 0 0-79.196z" fill="currentColor"></path></svg><!----></span></a> <span><!---->input_types와 output_types를 사용하여 설정 생성<!----></span></h3><!--]--><!----> <p>기존 파이프라인을 사용 중이거나 블록 정의를 깔끔하게 유지하려면, <code>input_types/output_types</code> 인수를 사용하여 설정을 생성할 때 유형을 지정하세요:</p> <div class="code-block relative "><div class="absolute top-2.5 right-4"><button class="inline-flex items-center relative text-sm focus:text-green-500 cursor-pointer focus:outline-none transition duration-200 ease-in-out opacity-0 mx-0.5 text-gray-600 " title="code excerpt" type="button"><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" fill="currentColor" focusable="false" role="img" width="1em" height="1em" preserveAspectRatio="xMidYMid meet" viewBox="0 0 32 32"><path d="M28,10V28H10V10H28m0-2H10a2,2,0,0,0-2,2V28a2,2,0,0,0,2,2H28a2,2,0,0,0,2-2V10a2,2,0,0,0-2-2Z" transform="translate(0)"></path><path d="M4,18H2V4A2,2,0,0,1,4,2H18V4H4Z" transform="translate(0)"></path><rect fill="none" width="32" height="32"></rect></svg><!----> <div class=" absolute pointer-events-none transition-opacity bg-black text-white py-1 px-2 leading-tight rounded font-normal shadow left-1/2 top-full transform -translate-x-1/2 translate-y-2 opacity-0 "><div class="absolute bottom-full left-1/2 transform -translate-x-1/2 w-0 h-0 border-black border-4 border-t-0" style="border-left-color: transparent; border-right-color: transparent;"></div> 복사됨</div><!----></button><!----></div> <pre class="language-python "><!----><span class="hljs-keyword">from</span> diffusers.modular_pipelines.mellon_node_utils <span class="hljs-keyword">import</span> MellonPipelineConfig

	mellon_config = MellonPipelineConfig.from_custom_block(
	blocks,
	input_types={<span class="hljs-string">"prompt"</span>: <span class="hljs-string">"textbox"</span>},
	output_types={<span class="hljs-string">"prompt"</span>: <span class="hljs-string">"text"</span>}
	)<!----></pre></div><!----> <blockquote class="note"><p><code>metadata</code>와 <code>input_types</code>/<code>output_types</code>가 모두 지정된 경우, 인수가 <code>metadata</code>를 덮어씁니다.</p></blockquote> <!--[1--><h2 class="relative group"><a id="generate-and-push-the-mellon-config" class="header-link block pr-1.5 text-lg no-hover:hidden with-hover:absolute with-hover:p-1.5 with-hover:opacity-0 with-hover:group-hover:opacity-100 with-hover:right-full" href="#generate-and-push-the-mellon-config"><span><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 256"><path d="M167.594 88.393a8.001 8.001 0 0 1 0 11.314l-67.882 67.882a8 8 0 1 1-11.314-11.315l67.882-67.881a8.003 8.003 0 0 1 11.314 0zm-28.287 84.86l-28.284 28.284a40 40 0 0 1-56.567-56.567l28.284-28.284a8 8 0 0 0-11.315-11.315l-28.284 28.284a56 56 0 0 0 79.196 79.197l28.285-28.285a8 8 0 1 0-11.315-11.314zM212.852 43.14a56.002 56.002 0 0 0-79.196 0l-28.284 28.284a8 8 0 1 0 11.314 11.314l28.284-28.284a40 40 0 0 1 56.568 56.567l-28.285 28.285a8 8 0 0 0 11.315 11.314l28.284-28.284a56.065 56.065 0 0 0 0-79.196z" fill="currentColor"></path></svg><!----></span></a> <span><!---->Mellon 설정을 생성하고 push합니다<!----></span></h2><!--]--><!----> <p>블록에 메타데이터를 추가한 후, 기본 Mellon 구성 템플릿을 생성하여 Hub에 push합니다:</p> <div class="code-block relative "><div class="absolute top-2.5 right-4"><button class="inline-flex items-center relative text-sm focus:text-green-500 cursor-pointer focus:outline-none transition duration-200 ease-in-out opacity-0 mx-0.5 text-gray-600 " title="code excerpt" type="button"><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" fill="currentColor" focusable="false" role="img" width="1em" height="1em" preserveAspectRatio="xMidYMid meet" viewBox="0 0 32 32"><path d="M28,10V28H10V10H28m0-2H10a2,2,0,0,0-2,2V28a2,2,0,0,0,2,2H28a2,2,0,0,0,2-2V10a2,2,0,0,0-2-2Z" transform="translate(0)"></path><path d="M4,18H2V4A2,2,0,0,1,4,2H18V4H4Z" transform="translate(0)"></path><rect fill="none" width="32" height="32"></rect></svg><!----> <div class=" absolute pointer-events-none transition-opacity bg-black text-white py-1 px-2 leading-tight rounded font-normal shadow left-1/2 top-full transform -translate-x-1/2 translate-y-2 opacity-0 "><div class="absolute bottom-full left-1/2 transform -translate-x-1/2 w-0 h-0 border-black border-4 border-t-0" style="border-left-color: transparent; border-right-color: transparent;"></div> 복사됨</div><!----></button><!----></div> <pre class="language-python "><!----><span class="hljs-keyword">from</span> diffusers <span class="hljs-keyword">import</span> ModularPipelineBlocks
	<span class="hljs-keyword">from</span> diffusers.modular_pipelines.mellon_node_utils <span class="hljs-keyword">import</span> MellonPipelineConfig

	<span class="hljs-comment"># load your custom blocks from your local dir</span>
	blocks = ModularPipelineBlocks.from_pretrained(<span class="hljs-string">"/path/local/folder"</span>, trust_remote_code=<span class="hljs-literal">True</span>)

	<span class="hljs-comment"># Generate the default config template</span>
	mellon_config = MellonPipelineConfig.from_custom_block(blocks)
	<span class="hljs-comment"># push the default template to `repo_id`, you will need to pass the same local folder path so that it will save the config locally first</span>
	mellon_config.save(
	local_dir=<span class="hljs-string">"/path/local/folder"</span>,
	repo_id= repo_id,
	push_to_hub=<span class="hljs-literal">True</span>
	)<!----></pre></div><!----> <p>이 작업은 저장소에 <code>mellon_pipeline_config.json</code> 파일을 생성합니다.</p> <!--[1--><h2 class="relative group"><a id="review-and-adjust-the-config" class="header-link block pr-1.5 text-lg no-hover:hidden with-hover:absolute with-hover:p-1.5 with-hover:opacity-0 with-hover:group-hover:opacity-100 with-hover:right-full" href="#review-and-adjust-the-config"><span><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 256"><path d="M167.594 88.393a8.001 8.001 0 0 1 0 11.314l-67.882 67.882a8 8 0 1 1-11.314-11.315l67.882-67.881a8.003 8.003 0 0 1 11.314 0zm-28.287 84.86l-28.284 28.284a40 40 0 0 1-56.567-56.567l28.284-28.284a8 8 0 0 0-11.315-11.315l-28.284 28.284a56 56 0 0 0 79.196 79.197l28.285-28.285a8 8 0 1 0-11.315-11.314zM212.852 43.14a56.002 56.002 0 0 0-79.196 0l-28.284 28.284a8 8 0 1 0 11.314 11.314l28.284-28.284a40 40 0 0 1 56.568 56.567l-28.285 28.285a8 8 0 0 0 11.315 11.314l28.284-28.284a56.065 56.065 0 0 0 0-79.196z" fill="currentColor"></path></svg><!----></span></a> <span><!---->config 검토 및 조정<!----></span></h2><!--]--><!----> <p>생성된 템플릿은 시작점일 뿐이며, 필요에 맞게 조정할 수 있습니다. Gemini Prompt Expander의 생성된 설정을 함께 살펴보겠습니다:</p> <div class="code-block relative "><div class="absolute top-2.5 right-4"><button class="inline-flex items-center relative text-sm focus:text-green-500 cursor-pointer focus:outline-none transition duration-200 ease-in-out opacity-0 mx-0.5 text-gray-600 " title="code excerpt" type="button"><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" fill="currentColor" focusable="false" role="img" width="1em" height="1em" preserveAspectRatio="xMidYMid meet" viewBox="0 0 32 32"><path d="M28,10V28H10V10H28m0-2H10a2,2,0,0,0-2,2V28a2,2,0,0,0,2,2H28a2,2,0,0,0,2-2V10a2,2,0,0,0-2-2Z" transform="translate(0)"></path><path d="M4,18H2V4A2,2,0,0,1,4,2H18V4H4Z" transform="translate(0)"></path><rect fill="none" width="32" height="32"></rect></svg><!----> <div class=" absolute pointer-events-none transition-opacity bg-black text-white py-1 px-2 leading-tight rounded font-normal shadow left-1/2 top-full transform -translate-x-1/2 translate-y-2 opacity-0 "><div class="absolute bottom-full left-1/2 transform -translate-x-1/2 w-0 h-0 border-black border-4 border-t-0" style="border-left-color: transparent; border-right-color: transparent;"></div> 복사됨</div><!----></button><!----></div> <pre class="language-json "><!----><span class="hljs-punctuation">{</span>
	<span class="hljs-attr">"label"</span><span class="hljs-punctuation">:</span> <span class="hljs-string">"Gemini Prompt Expander"</span><span class="hljs-punctuation">,</span>
	<span class="hljs-attr">"default_repo"</span><span class="hljs-punctuation">:</span> <span class="hljs-string">""</span><span class="hljs-punctuation">,</span>
	<span class="hljs-attr">"default_dtype"</span><span class="hljs-punctuation">:</span> <span class="hljs-string">""</span><span class="hljs-punctuation">,</span>
	<span class="hljs-attr">"node_params"</span><span class="hljs-punctuation">:</span> <span class="hljs-punctuation">{</span>
	<span class="hljs-attr">"custom"</span><span class="hljs-punctuation">:</span> <span class="hljs-punctuation">{</span>
	<span class="hljs-attr">"params"</span><span class="hljs-punctuation">:</span> <span class="hljs-punctuation">{</span>
	<span class="hljs-attr">"prompt"</span><span class="hljs-punctuation">:</span> <span class="hljs-punctuation">{</span>
	<span class="hljs-attr">"label"</span><span class="hljs-punctuation">:</span> <span class="hljs-string">"Prompt"</span><span class="hljs-punctuation">,</span>
	<span class="hljs-attr">"type"</span><span class="hljs-punctuation">:</span> <span class="hljs-string">"string"</span><span class="hljs-punctuation">,</span>
	<span class="hljs-attr">"display"</span><span class="hljs-punctuation">:</span> <span class="hljs-string">"textarea"</span><span class="hljs-punctuation">,</span>
	<span class="hljs-attr">"default"</span><span class="hljs-punctuation">:</span> <span class="hljs-string">""</span>
	<span class="hljs-punctuation">}</span><span class="hljs-punctuation">,</span>
	<span class="hljs-attr">"out_prompt"</span><span class="hljs-punctuation">:</span> <span class="hljs-punctuation">{</span>
	<span class="hljs-attr">"label"</span><span class="hljs-punctuation">:</span> <span class="hljs-string">"Prompt"</span><span class="hljs-punctuation">,</span>
	<span class="hljs-attr">"type"</span><span class="hljs-punctuation">:</span> <span class="hljs-string">"string"</span><span class="hljs-punctuation">,</span>
	<span class="hljs-attr">"display"</span><span class="hljs-punctuation">:</span> <span class="hljs-string">"output"</span>
	<span class="hljs-punctuation">}</span><span class="hljs-punctuation">,</span>
	<span class="hljs-attr">"old_prompt"</span><span class="hljs-punctuation">:</span> <span class="hljs-punctuation">{</span>
	<span class="hljs-attr">"label"</span><span class="hljs-punctuation">:</span> <span class="hljs-string">"Old Prompt"</span><span class="hljs-punctuation">,</span>
	<span class="hljs-attr">"type"</span><span class="hljs-punctuation">:</span> <span class="hljs-string">"custom"</span><span class="hljs-punctuation">,</span>
	<span class="hljs-attr">"display"</span><span class="hljs-punctuation">:</span> <span class="hljs-string">"output"</span>
	<span class="hljs-punctuation">}</span><span class="hljs-punctuation">,</span>
	<span class="hljs-attr">"doc"</span><span class="hljs-punctuation">:</span> <span class="hljs-punctuation">{</span>
	<span class="hljs-attr">"label"</span><span class="hljs-punctuation">:</span> <span class="hljs-string">"Doc"</span><span class="hljs-punctuation">,</span>
	<span class="hljs-attr">"type"</span><span class="hljs-punctuation">:</span> <span class="hljs-string">"string"</span><span class="hljs-punctuation">,</span>
	<span class="hljs-attr">"display"</span><span class="hljs-punctuation">:</span> <span class="hljs-string">"output"</span>
	<span class="hljs-punctuation">}</span>
	<span class="hljs-punctuation">}</span><span class="hljs-punctuation">,</span>
	<span class="hljs-attr">"input_names"</span><span class="hljs-punctuation">:</span> <span class="hljs-punctuation">[</span><span class="hljs-string">"prompt"</span><span class="hljs-punctuation">]</span><span class="hljs-punctuation">,</span>
	<span class="hljs-attr">"model_input_names"</span><span class="hljs-punctuation">:</span> <span class="hljs-punctuation">[</span><span class="hljs-punctuation">]</span><span class="hljs-punctuation">,</span>
	<span class="hljs-attr">"output_names"</span><span class="hljs-punctuation">:</span> <span class="hljs-punctuation">[</span><span class="hljs-string">"out_prompt"</span><span class="hljs-punctuation">,</span> <span class="hljs-string">"old_prompt"</span><span class="hljs-punctuation">,</span> <span class="hljs-string">"doc"</span><span class="hljs-punctuation">]</span><span class="hljs-punctuation">,</span>
	<span class="hljs-attr">"block_name"</span><span class="hljs-punctuation">:</span> <span class="hljs-string">"custom"</span><span class="hljs-punctuation">,</span>
	<span class="hljs-attr">"node_type"</span><span class="hljs-punctuation">:</span> <span class="hljs-string">"custom"</span>
	<span class="hljs-punctuation">}</span>
	<span class="hljs-punctuation">}</span>
	<span class="hljs-punctuation">}</span><!----></pre></div><!----> <!--[2--><h3 class="relative group"><a id="understanding-the-structure" class="header-link block pr-1.5 text-lg no-hover:hidden with-hover:absolute with-hover:p-1.5 with-hover:opacity-0 with-hover:group-hover:opacity-100 with-hover:right-full" href="#understanding-the-structure"><span><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 256"><path d="M167.594 88.393a8.001 8.001 0 0 1 0 11.314l-67.882 67.882a8 8 0 1 1-11.314-11.315l67.882-67.881a8.003 8.003 0 0 1 11.314 0zm-28.287 84.86l-28.284 28.284a40 40 0 0 1-56.567-56.567l28.284-28.284a8 8 0 0 0-11.315-11.315l-28.284 28.284a56 56 0 0 0 79.196 79.197l28.285-28.285a8 8 0 1 0-11.315-11.314zM212.852 43.14a56.002 56.002 0 0 0-79.196 0l-28.284 28.284a8 8 0 1 0 11.314 11.314l28.284-28.284a40 40 0 0 1 56.568 56.567l-28.285 28.285a8 8 0 0 0 11.315 11.314l28.284-28.284a56.065 56.065 0 0 0 0-79.196z" fill="currentColor"></path></svg><!----></span></a> <span><!---->구조 이해하기<!----></span></h3><!--]--><!----> <p><code>params</code> 딕셔너리는 각 UI 요소가 어떻게 렌더링되는지 정의합니다. <code>input_names</code>, <code>model_input_names</code>, <code>output_names</code> 목록은 이러한 UI 요소를 <a href="/docs/diffusers/main/ko/api/modular_diffusers/pipeline_blocks#diffusers.ModularPipelineBlocks">ModularPipelineBlocks</a>의 I/O 인터페이스에 매핑합니다:</p> <table><thead><tr><th>Mellon 설정</th><th>ModularPipelineBlocks</th></tr></thead><tbody><tr><td><code>input_names</code></td><td><code>inputs</code> 속성</td></tr><tr><td><code>model_input_names</code></td><td><code>expected_components</code> 속성</td></tr><tr><td><code>output_names</code></td><td><code>intermediate_outputs</code> 속성</td></tr></tbody></table> <p>이 예시에서: <code>prompt</code>가 유일한 입력입니다. 모델 구성 요소는 없으며, 출력에는 <code>out_prompt</code>, <code>old_prompt</code>, <code>doc</code>가 포함됩니다.</p> <p>이제 <code>params</code> 딕셔너리를 살펴보겠습니다:</p> <ul><li><p><strong><code>prompt</code></strong>: <code>display: "textarea"</code> (텍스트 입력 박스로 렌더링됨), <code>label: "Prompt"</code> (UI에 표시됨), <code>default: ""</code> (빈 상태로 시작)를 가진 입력 매개변수입니다. <code>type: "string"</code> 필드는 Mellon에서 중요합니다. 어떤 노드끼리 연결될 수 있는지를 결정하기 때문입니다. 동일한 타입끼리만 “noodles”로 연결할 수 있습니다.</p></li> <li><p><strong><code>out_prompt</code></strong>: 확장된 프롬프트 출력입니다. 입력과 출력이 동일한 이름(<code>prompt</code>)을 공유하므로 설정에서 이름 충돌을 피하기 위해 <code>out_</code> 접두사가 자동으로 추가되었습니다. <code>display: "output"</code>를 가지고 있어 출력 소켓으로 렌더링됩니다.</p></li> <li><p><strong><code>old_prompt</code></strong>: 메타데이터를 지정하지 않았기 때문에 <code>type: "custom"</code>입니다. UI에서는 단순한 점으로 표시됩니다. 실제로 UI에 노출할 의도가 없으므로 제거할 수 있습니다.</p></li> <li><p><strong><code>doc</code></strong>: 문서 출력으로, 모든 커스텀 블록에 자동으로 추가됩니다.</p></li></ul> <!--[2--><h3 class="relative group"><a id="making-adjustments" class="header-link block pr-1.5 text-lg no-hover:hidden with-hover:absolute with-hover:p-1.5 with-hover:opacity-0 with-hover:group-hover:opacity-100 with-hover:right-full" href="#making-adjustments"><span><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 256"><path d="M167.594 88.393a8.001 8.001 0 0 1 0 11.314l-67.882 67.882a8 8 0 1 1-11.314-11.315l67.882-67.881a8.003 8.003 0 0 1 11.314 0zm-28.287 84.86l-28.284 28.284a40 40 0 0 1-56.567-56.567l28.284-28.284a8 8 0 0 0-11.315-11.315l-28.284 28.284a56 56 0 0 0 79.196 79.197l28.285-28.285a8 8 0 1 0-11.315-11.314zM212.852 43.14a56.002 56.002 0 0 0-79.196 0l-28.284 28.284a8 8 0 1 0 11.314 11.314l28.284-28.284a40 40 0 0 1 56.568 56.567l-28.285 28.285a8 8 0 0 0 11.315 11.314l28.284-28.284a56.065 56.065 0 0 0 0-79.196z" fill="currentColor"></path></svg><!----></span></a> <span><!---->조절하기<!----></span></h3><!--]--><!----> <p>더 이상 사용하지 않으므로 <code>old_prompt</code>를 <code>params</code>와 <code>output_names</code> 양쪽에서 제거하세요.</p> <div class="code-block relative "><div class="absolute top-2.5 right-4"><button class="inline-flex items-center relative text-sm focus:text-green-500 cursor-pointer focus:outline-none transition duration-200 ease-in-out opacity-0 mx-0.5 text-gray-600 " title="code excerpt" type="button"><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" fill="currentColor" focusable="false" role="img" width="1em" height="1em" preserveAspectRatio="xMidYMid meet" viewBox="0 0 32 32"><path d="M28,10V28H10V10H28m0-2H10a2,2,0,0,0-2,2V28a2,2,0,0,0,2,2H28a2,2,0,0,0,2-2V10a2,2,0,0,0-2-2Z" transform="translate(0)"></path><path d="M4,18H2V4A2,2,0,0,1,4,2H18V4H4Z" transform="translate(0)"></path><rect fill="none" width="32" height="32"></rect></svg><!----> <div class=" absolute pointer-events-none transition-opacity bg-black text-white py-1 px-2 leading-tight rounded font-normal shadow left-1/2 top-full transform -translate-x-1/2 translate-y-2 opacity-0 "><div class="absolute bottom-full left-1/2 transform -translate-x-1/2 w-0 h-0 border-black border-4 border-t-0" style="border-left-color: transparent; border-right-color: transparent;"></div> 복사됨</div><!----></button><!----></div> <pre class="language-json "><!----><span class="hljs-punctuation">{</span>
	<span class="hljs-attr">"label"</span><span class="hljs-punctuation">:</span> <span class="hljs-string">"Gemini Prompt Expander"</span><span class="hljs-punctuation">,</span>
	<span class="hljs-attr">"default_repo"</span><span class="hljs-punctuation">:</span> <span class="hljs-string">""</span><span class="hljs-punctuation">,</span>
	<span class="hljs-attr">"default_dtype"</span><span class="hljs-punctuation">:</span> <span class="hljs-string">""</span><span class="hljs-punctuation">,</span>
	<span class="hljs-attr">"node_params"</span><span class="hljs-punctuation">:</span> <span class="hljs-punctuation">{</span>
	<span class="hljs-attr">"custom"</span><span class="hljs-punctuation">:</span> <span class="hljs-punctuation">{</span>
	<span class="hljs-attr">"params"</span><span class="hljs-punctuation">:</span> <span class="hljs-punctuation">{</span>
	<span class="hljs-attr">"prompt"</span><span class="hljs-punctuation">:</span> <span class="hljs-punctuation">{</span>
	<span class="hljs-attr">"label"</span><span class="hljs-punctuation">:</span> <span class="hljs-string">"Prompt"</span><span class="hljs-punctuation">,</span>
	<span class="hljs-attr">"type"</span><span class="hljs-punctuation">:</span> <span class="hljs-string">"string"</span><span class="hljs-punctuation">,</span>
	<span class="hljs-attr">"display"</span><span class="hljs-punctuation">:</span> <span class="hljs-string">"textarea"</span><span class="hljs-punctuation">,</span>
	<span class="hljs-attr">"default"</span><span class="hljs-punctuation">:</span> <span class="hljs-string">""</span>
	<span class="hljs-punctuation">}</span><span class="hljs-punctuation">,</span>
	<span class="hljs-attr">"out_prompt"</span><span class="hljs-punctuation">:</span> <span class="hljs-punctuation">{</span>
	<span class="hljs-attr">"label"</span><span class="hljs-punctuation">:</span> <span class="hljs-string">"Prompt"</span><span class="hljs-punctuation">,</span>
	<span class="hljs-attr">"type"</span><span class="hljs-punctuation">:</span> <span class="hljs-string">"string"</span><span class="hljs-punctuation">,</span>
	<span class="hljs-attr">"display"</span><span class="hljs-punctuation">:</span> <span class="hljs-string">"output"</span>
	<span class="hljs-punctuation">}</span><span class="hljs-punctuation">,</span>
	<span class="hljs-attr">"doc"</span><span class="hljs-punctuation">:</span> <span class="hljs-punctuation">{</span>
	<span class="hljs-attr">"label"</span><span class="hljs-punctuation">:</span> <span class="hljs-string">"Doc"</span><span class="hljs-punctuation">,</span>
	<span class="hljs-attr">"type"</span><span class="hljs-punctuation">:</span> <span class="hljs-string">"string"</span><span class="hljs-punctuation">,</span>
	<span class="hljs-attr">"display"</span><span class="hljs-punctuation">:</span> <span class="hljs-string">"output"</span>
	<span class="hljs-punctuation">}</span>
	<span class="hljs-punctuation">}</span><span class="hljs-punctuation">,</span>
	<span class="hljs-attr">"input_names"</span><span class="hljs-punctuation">:</span> <span class="hljs-punctuation">[</span><span class="hljs-string">"prompt"</span><span class="hljs-punctuation">]</span><span class="hljs-punctuation">,</span>
	<span class="hljs-attr">"model_input_names"</span><span class="hljs-punctuation">:</span> <span class="hljs-punctuation">[</span><span class="hljs-punctuation">]</span><span class="hljs-punctuation">,</span>
	<span class="hljs-attr">"output_names"</span><span class="hljs-punctuation">:</span> <span class="hljs-punctuation">[</span><span class="hljs-string">"out_prompt"</span><span class="hljs-punctuation">,</span> <span class="hljs-string">"doc"</span><span class="hljs-punctuation">]</span><span class="hljs-punctuation">,</span>
	<span class="hljs-attr">"block_name"</span><span class="hljs-punctuation">:</span> <span class="hljs-string">"custom"</span><span class="hljs-punctuation">,</span>
	<span class="hljs-attr">"node_type"</span><span class="hljs-punctuation">:</span> <span class="hljs-string">"custom"</span>
	<span class="hljs-punctuation">}</span>
	<span class="hljs-punctuation">}</span>
	<span class="hljs-punctuation">}</span><!----></pre></div><!----> <p>최종 설정은 <a href="https://huggingface.co/diffusers/gemini-prompt-expander-mellon" rel="nofollow">diffusers/gemini-prompt-expander-mellon</a>에서 확인하세요.</p> <a class="!text-gray-400 !no-underline text-sm flex items-center not-prose mt-4" href="https://github.com/huggingface/diffusers/blob/main/docs/source/en/modular_diffusers/mellon.md" target="_blank"><svg class="mr-1" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" fill="currentColor" focusable="false" role="img" width="1em" height="1em" preserveAspectRatio="xMidYMid meet" viewBox="0 0 32 32"><path d="M31,16l-7,7l-1.41-1.41L28.17,16l-5.58-5.59L24,9l7,7z"></path><path d="M1,16l7-7l1.41,1.41L3.83,16l5.58,5.59L8,23l-7-7z"></path><path d="M12.419,25.484L17.639,6.552l1.932,0.518L14.351,26.002z"></path></svg><!----> <span><span class="underline">Update</span> on GitHub</span></a><!----> <p></p><!--]--><!----><!--]--><!--]--><!--]--> <!--[-1--><!--]--><!--]-->

	<script>
	{
	__sveltekit_1rjuniz = {
	base: "/docs/diffusers/main/en",
	assets: "/docs/diffusers/main/en"
	};

	const element = document.currentScript.parentElement;

	Promise.all([
	import("/docs/diffusers/main/en/_app/immutable/entry/start.vZc-dOUR.js"),
	import("/docs/diffusers/main/en/_app/immutable/entry/app.B6c3Ml05.js")
	]).then(([kit, app]) => {
	kit.start(app, element, {
	node_ids: [0, 319],
	data: [null,null],
	form: null,
	error: null
	});
	});
	}
	</script>