Skip to content

Instantly share code, notes, and snippets.

@liaotzukai
Last active December 12, 2025 07:45
Show Gist options
  • Select an option

  • Save liaotzukai/d1306e3f57d6902e1ddedfc8072e1616 to your computer and use it in GitHub Desktop.

Select an option

Save liaotzukai/d1306e3f57d6902e1ddedfc8072e1616 to your computer and use it in GitHub Desktop.

Revisions

  1. liaotzukai revised this gist Dec 12, 2025. 3 changed files with 4 additions and 6 deletions.
    2 changes: 2 additions & 0 deletions .env
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,2 @@
    NGROK_AUTHTOKEN=
    NGROK_TUNNEL_NAME=
    2 changes: 0 additions & 2 deletions docker-compose.yml
    Original file line number Diff line number Diff line change
    @@ -15,12 +15,10 @@ services:

    # https://docs.n8n.io/hosting/configuration/configuration-examples/isolation/

    # 為防止您的 n8n 執行個體連接到 n8n 的伺服器,請將下列環境變數設為 false
    - N8N_DIAGNOSTICS_ENABLED=false
    - N8N_VERSION_NOTIFICATIONS_ENABLED=false
    - N8N_TEMPLATES_ENABLED=true

    # 取消設定 n8n 的診斷配置
    - EXTERNAL_FRONTEND_HOOKS_URLS=
    - N8N_DIAGNOSTICS_CONFIG_FRONTEND=
    - N8N_DIAGNOSTICS_CONFIG_BACKEND=
    6 changes: 2 additions & 4 deletions n8n-init.sh
    Original file line number Diff line number Diff line change
    @@ -1,22 +1,20 @@
    #!/bin/sh
    set -e

    # 先啟動 n8n(背景執行)
    n8n start &

    echo "[init] Waiting for n8n to finish building frontend..."
    # 等待 public/static 出現

    while [ ! -d /home/node/.cache/n8n/public/static ]; do
    sleep 1
    done

    sleep 2 # 再多等一下,確保生成完成
    sleep 2

    echo "[init] Applying static override..."
    cp /tmp/prefers-color-scheme.css \
    /home/node/.cache/n8n/public/static/prefers-color-scheme.css

    echo "[init] Done. Tail logs..."

    # 讓 container 保持前景執行
    wait -n
  2. liaotzukai created this gist Dec 12, 2025.
    48 changes: 48 additions & 0 deletions docker-compose.yml
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,48 @@
    volumes:
    n8n_data:

    services:

    n8n:
    container_name: n8n
    image: docker.n8n.io/n8nio/n8n
    restart: always
    environment:

    - GENERIC_TIMEZONE="Asis/Taipei"
    - TZ="Asis/Taipei"
    - N8N_ENFORCE_SETTINGS_FILE_PERMISSIONS=true

    # https://docs.n8n.io/hosting/configuration/configuration-examples/isolation/

    # 為防止您的 n8n 執行個體連接到 n8n 的伺服器,請將下列環境變數設為 false
    - N8N_DIAGNOSTICS_ENABLED=false
    - N8N_VERSION_NOTIFICATIONS_ENABLED=false
    - N8N_TEMPLATES_ENABLED=true

    # 取消設定 n8n 的診斷配置
    - EXTERNAL_FRONTEND_HOOKS_URLS=
    - N8N_DIAGNOSTICS_CONFIG_FRONTEND=
    - N8N_DIAGNOSTICS_CONFIG_BACKEND=

    # https://docs.n8n.io/hosting/configuration/configuration-examples/webhook-url/
    - WEBHOOK_URL=https://${NGROK_TUNNEL_NAME}
    - N8N_PROXY_HOPS=1
    ports:
    - 5678:5678
    volumes:
    - n8n_data:/home/node/.n8n
    - ./n8n-init.sh:/tmp/n8n-init.sh
    - ./prefers-color-scheme.css:/tmp/prefers-color-scheme.css
    entrypoint: ["/tmp/n8n-init.sh"]
    command: ["n8n", "start"]

    ngrok:
    container_name: ngrok
    image: ngrok/ngrok:latest
    restart: always
    environment:
    - NGROK_AUTHTOKEN=${NGROK_AUTHTOKEN}
    command: http --url=${NGROK_TUNNEL_NAME} n8n:5678
    depends_on:
    - n8n
    22 changes: 22 additions & 0 deletions n8n-init.sh
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,22 @@
    #!/bin/sh
    set -e

    # 先啟動 n8n(背景執行)
    n8n start &

    echo "[init] Waiting for n8n to finish building frontend..."
    # 等待 public/static 出現
    while [ ! -d /home/node/.cache/n8n/public/static ]; do
    sleep 1
    done

    sleep 2 # 再多等一下,確保生成完成

    echo "[init] Applying static override..."
    cp /tmp/prefers-color-scheme.css \
    /home/node/.cache/n8n/public/static/prefers-color-scheme.css

    echo "[init] Done. Tail logs..."

    # 讓 container 保持前景執行
    wait -n
    21 changes: 21 additions & 0 deletions prefers-color-scheme.css
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,21 @@

    :root {
    --canvas-edge--color: SpringGreen;
    }

    .vue-flow__edge-path,
    .vue-flow__connection-path {
    stroke-linecap: round !important;
    stroke-dasharray: 6;
    animation: neonFlow 1s linear infinite;
    filter:
    drop-shadow(0 0 4px var(--canvas-edge--color))
    drop-shadow(0 0 8px var(--canvas-edge--color))

    }

    @keyframes neonFlow {
    to {
    stroke-dashoffset: -24;
    }
    }