Forge Custom UI Deployment Issue: Subfolders Not Being Included in Deployment Package

Forge Forge UI Kit and Custom UI
1

Issue Summary

When deploying my Forge app (jira-custom-ui), the editor folder and all its files from the edit-modal dist folder are not being included in the deployed package. The app works correctly when running with npm run dev because the tunnel points to my local machine, but fails in production deployment.

Project Structure

My project is a Forge app with a custom UI for Jira. The main structure is:

packages/
  forge/
    jira-custom-ui/       # Forge app
      manifest.yml        # Defines resources
    ui/
      edit-modal/         # React UI with editor resources
        dist/             # Build output 
          bundle.js       # Main application bundle
          editor/         # This folder should be included but is missing in deployment
            *.js files    # Editor resources
      jira-panel/         # Main panel UI that opens the modal
        src/
          App/
            App.jsx       # Contains openProjectEditModal function

Technical Details

manifest.yml

resources:
  - key: ui
    path: ../ui/jira-panel/dist
    tunnel:
      port: 3003
  - key: edit-project-modal 
    path: ../ui/edit-modal/dist
    tunnel:
      port: 3004

edit-modal/package.json

"scripts": {
  "dev": "node scripts/copy-editor-resources.js && webpack serve",
  "build": "node scripts/copy-editor-resources.js && NODE_ENV=production webpack --mode=production",
  "copy-editor": "node scripts/copy-editor-resources.js"
}

The Modal Opening Code

In jira-panel/src/App/App.jsx, the modal is opened using:

const modal = new Modal({
    resource: 'edit-project-modal', // The resource ID of the modal
    size: 'max',
    closeOnEscape: true,
    closeOnOverlayClick: true,
    context: modalPayload
    // ...
});

This references the ‘edit-project-modal’ resource defined in the manifest.yml, which points to ‘../ui/edit-modal/dist’. The problem is that when the app is deployed, the editor folder inside this dist directory is not included.

Working Comparison: Native UI vs Custom UI

Interestingly, I have another Forge project (jira-native-ui) in the same repository that successfully deploys static resources:

# From jira-native-ui/manifest.yml
resources:
  - key: main
    path: src/frontend/index.jsx

  - key: b4-bundle
    path: resources/b4

In this project, I’m using Forge’s Native UI rendering (not Custom UI), and it references a static resource called ‘b4-bundle’ which points to the resources/b4 directory. The critical difference is that in the native UI project, the resources/b4 folder and all its subfolders are correctly copied to the Forge platform when deployed.

This is referenced in the code using:

<Frame resource="b4-bundle" />

This comparison suggests that static resources can indeed be deployed to Forge, but something is different about how resources are handled with custom UI modules compared to native UI modules.

What I’ve Tried

  1. Verified that the editor folder exists in public/ when building
  2. Confirmed webpack configuration includes CopyWebpackPlugin to copy the editor resources
  3. Modified the build process to ensure the editor resources are copied before building
  4. Added logging to confirm the files exist during build time

Expected Behavior

When deploying to Forge with forge deploy, the entire contents of the dist folder including the editor/ subfolder should be deployed and accessible in the production environment.

Actual Behavior

After deployment, the editor/ folder is missing from the production environment. This causes the app to fail when users try to use the editor functionality via the “Edit Wireframes” button in the panel.

Questions

  1. Is there a size limit for Forge deployments that might be causing the editor files to be excluded?
  2. Is there a specific configuration needed to ensure all subfolders in a resource’s path are included?
  3. Should I be using a different approach to include these resources?
  4. Why do static resources work correctly with Native UI resources but not with Custom UI resources?

Environment

  • Forge CLI version: 11.3.0
  • Operating system: macOS

Any advice or insights would be greatly appreciated!