Add deploy script (#96)

.env_example

@@ -5,3 +5,9 @@ PLAYWRIGHT_TEST_URL=http://localhost:5173
 # Proxy target of the local development server
 # Note: localhost:8188 does not work.
 DEV_SERVER_COMFYUI_URL=http://127.0.0.1:8188
+
+# The target ComfyUI checkout directory to deploy the frontend code to.
+# The dist directory will be copied to {DEPLOY_COMFY_UI_DIR}/custom_web_versions/main/dev
+# Add `--front-end-root {DEPLOY_COMFY_UI_DIR}/custom_web_versions/main/dev`
+# to ComfyUI launch script to serve the custom web version.
+DEPLOY_COMFYUI_DIR=/home/ComfyUI/web

README.md

@@ -52,7 +52,8 @@ core extensions will be loaded.
 
 ## Deploy
 
-Copy everything under `dist/` to `ComfyUI/web/` in your ComfyUI checkout.
+- 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.
 
 ## Breaking changes
 

package-lock.json

@@ -21,6 +21,7 @@
         "@types/node": "^20.14.8",
         "babel-plugin-transform-import-meta": "^2.2.1",
         "babel-plugin-transform-rename-import": "^2.3.0",
+        "fs-extra": "^11.2.0",
         "husky": "^9.0.11",
         "identity-obj-proxy": "^3.0.0",
         "jest": "^29.7.0",

package.json

@@ -6,6 +6,7 @@
   "scripts": {
     "dev": "vite",
     "build": "npm run typecheck && vite build",
+    "deploy": "node scripts/deploy.js",
     "zipdist": "node scripts/zipdist.js",
     "typecheck": "tsc --noEmit",
     "format": "prettier --write 'src/**/*.{js,ts,tsx}'",
@@ -23,6 +24,7 @@
     "@types/node": "^20.14.8",
     "babel-plugin-transform-import-meta": "^2.2.1",
     "babel-plugin-transform-rename-import": "^2.3.0",
+    "fs-extra": "^11.2.0",
     "husky": "^9.0.11",
     "identity-obj-proxy": "^3.0.0",
     "jest": "^29.7.0",

scripts/deploy.js

@@ -0,0 +1,14 @@
+import { copy } from 'fs-extra';
+import { config } from "dotenv";
+config();
+
+const sourceDir = './dist';
+const targetDir = process.env.DEPLOY_COMFYUI_DIR;
+
+copy(sourceDir, targetDir)
+  .then(() => {
+    console.log(`Directory copied successfully! ${sourceDir} -> ${targetDir}`);
+  })
+  .catch((err) => {
+    console.error('Error copying directory:', err);
+  });