Forge deploy failure for custom ui forge app (Non React framework)

Hi all,
Encountering errors configuring a Forge CustomUI app with a non-React framework. First attempt using Svelte.

Svelte code compiles and can be used locally, but connecting to a simple Forge app configuration throws errors.

:information_source: Packaging app files
Error: Bundling failed: Module parse failed: Unexpected token (1:0)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See Concepts | webpack

Is it still possible to use non-React frameworks for Forge Custom UI?

Hi @DennyMiller , yes it should be possible. Depending on what application framework you’re using, you’ll have to bundle your code first. For example, if you’re using SvelteKit, you’ll need to run npm run build. This will create a prod ready dist or build folder with your browser code. Then you’ll need to point to this resources path in the manifest.yml file.
By default, resources is pointing to:

resources:
  - key: main
    path: static/hello-world/build

if SvelteKit generates a different named folder, you’ll need to update it to

resources:
  - key: main
    path: static/hello-world/<my-build-folder>

This will need to be done for every change. Tunnelling is available if you want to avoid manually bundling your code on every change https://developer.atlassian.com/platform/forge/tunneling/#connecting-the-tunnel-to-your-own-dev-server

Hi @DennyMiller ,

If You still struggling with this problem, please grab a working solution on my repo - Bitbucket

What I did - I’ve bundled (as a static resources, see - Static site generation • Docs • SvelteKit for reference) Svelte App using Svelte Kit as a Forge Custom UI component.

Routing, css and stuff - everything is working like a charm :slight_smile: - but feel free to contact me directly in case of any problems.

Cheers,
Michal Dubel

1 Like