Nightly releases are published daily at https://github.com/Comfy-Org/ComfyUI_frontend/releases.

To use the latest nightly release, add the following command line argument to your ComfyUI launch script:

--front-end-version Comfy-Org/ComfyUI_frontend@latest

Edit your run_cpu.bat or run_nvidia_gpu.bat file as follows:

.\python_embeded\python.exe -s ComfyUI\main.py --windows-standalone-build --front-end-version Comfy-Org/ComfyUI_frontend@latest
pause

Stable releases are published weekly in the ComfyUI main repository, aligned with ComfyUI backend's stable release schedule.

There will be a 2-day feature freeze before each stable release. During this period, no new major features will be merged.

app.registerExtension({
  name: 'TestExtension1',
  aboutPageBadges: [
    {
      label: 'Test Badge',
      url: 'https://example.com',
      icon: 'pi pi-box'
    }
  ]
})

app.registerExtension({
  name: 'TestExtension',
  bottomPanelTabs: [
    {
      id: 'TestTab',
      title: 'Test Tab',
      type: 'custom',
      render: (el) => {
        el.innerHTML = '<div>Custom tab</div>'
      }
    }
  ]
})

// Register a new setting
app.ui.settings.addSetting({
  id: 'TestSetting',
  name: 'Test Setting',
  type: 'text',
  defaultValue: 'Hello, world!'
})

// Get the value of a setting
const value = app.ui.settings.getSettingValue('TestSetting')

// Set the value of a setting
app.ui.settings.setSettingValue('TestSetting', 'Hello, universe!')

// Register a new setting
app.registerExtension({
  name: 'TestExtension1',
  settings: [
    {
      id: 'TestSetting',
      name: 'Test Setting',
      type: 'text',
      defaultValue: 'Hello, world!'
    }
  ]
})

// Get the value of a setting
const value = app.extensionManager.setting.get('TestSetting')

// Set the value of a setting
app.extensionManager.setting.set('TestSetting', 'Hello, universe!')

  app.registerExtension({
    name: 'TestExtension1',
    commands: [
      {
        id: 'TestCommand',
        function: () => {
          alert('TestCommand')
        }
      }
    ],
    keybindings: [
      {
        combo: { key: 'k' },
        commandId: 'TestCommand'
      }
    ]
  })

  app.registerExtension({
    name: 'TestExtension1',
    commands: [
      {
        id: 'foo-id',
        label: 'foo',
        function: () => {
          alert(1)
        }
      }
    ],
    menuCommands: [
      {
        path: ['ext', 'ext2'],
        commands: ['foo-id']
      }
    ]
  })

  app.extensionManager.toast.add({
    severity: 'info',
    summary: 'Loaded!',
    detail: 'Extension loaded!',
    life: 3000
  })

  app.extensionManager.registerSidebarTab({
    id: "search",
    icon: "pi pi-search",
    title: "search",
    tooltip: "search",
    type: "custom",
    render: (el) => {
      el.innerHTML = "<div>Custom search tab</div>";
    },
  });

• Vue 3 with TypeScript
• Pinia for state management
• PrimeVue with TailwindCSS for UI
• Litegraph for node editor
• zod for schema validation

Run npm run prepare to install Git pre-commit hooks. Currently, the pre-commit hook is used to auto-format code on commit.

Note: The dev server will NOT load any extension from the ComfyUI server. Only core extensions will be loaded.

• Start local ComfyUI backend at localhost:8188
• Run npm run dev to start the dev server
• Run npm run dev:electron to start the dev server with electron API mocked

Enable remote access to the dev server by setting VITE_REMOTE_DEV in .env to true.

After you start the dev server, you should see following logs:

> [email protected] dev
> vite


  VITE v5.4.6  ready in 488 ms

  ➜  Local:   http://localhost:5173/
  ➜  Network: http://172.21.80.1:5173/
  ➜  Network: http://192.168.2.20:5173/
  ➜  press h   enter to show help

Make sure your desktop machine and touch device are on the same network. On your touch device, navigate to http://<server_ip>:5173 (e.g. http://192.168.2.20:5173 here), to access the ComfyUI frontend.

• git clone https://github.com/comfyanonymous/ComfyUI_examples.git to tests-ui/ComfyUI_examples or the EXAMPLE_REPO_PATH location specified in .env
• npm i to install all dependencies
• npm run test:generate to fetch tests-ui/data/object_info.json
• npm run test:generate:examples to extract the example workflows
• npm run test to execute all unit tests.

Component test verifies Vue components in src/components/.

• npm run test:component to execute all component tests.

Playwright test verifies the whole app. See https://github.com/Comfy-Org/ComfyUI_frontend/blob/main/browser_tests/README.md for details.

This repo is using litegraph package hosted on https://github.com/Comfy-Org/litegraph.js. Any changes to litegraph should be submitted in that repo instead.

• Run npm link in the local litegraph repo.
• Run npm link @comfyorg/litegraph in this repo.

This will replace the litegraph package in this repo with the local litegraph repo.

• Option 1: Set DEPLOY_COMFYUI_DIR in .env and run npm run deploy.
• Option 2: Copy everything under dist/ to ComfyUI/web/ in your ComfyUI checkout manually.

Run following command to publish a release to ComfyUI main repo. The script will create a new branch and do a commit to web/ folder by checkout dist.zip from GitHub release.

• python scripts/main_repo_release.py <path_to_comfyui_main_repo> <version>