How to fix ReferenceError: window is not defined

Forge Forge UI Kit and Custom UI
,
1

Hi, I’m using previous UI kit 1 (@forge/ui@1.11.0) and I’d like to migrate to UI kit 2. (Thanks for supporting react officially in advance!)

But I get ReferenceError: window is not defined error since I’ve replaced all imports and component props. Heres my setting:

  • "@forge/api": "^3.3.0"
  • "@forge/cli": "^7.0.1"
  • "@forge/react": "^10.1.0"
  • "crypto": "^1.0.1"
  • "react": "^18.2.0"

And

  • index.jsx
import React, { useEffect } from 'react';
import { Text } from '@forge/react';
export function run() {
  useEffect(() => {
    console.log('hello world')
  }, [])

  return <Text>hello</Text>
}
  • manifest.yml
modules:
  jira:projectPage:
    - key: foo-application
      title: foo-application
      function: main
  function:
    - key: main
      handler: index.run
app:
  runtime:
    name: nodejs18.x
  id: ari:cloud:ecosystem::*******

And I’m testing with forge tunnel.

2

Self closing this question.

I had to change manifest.yml

modules:
  jira:projectPage:
    - key: foo-application
      title: foo-application
-     function: main
- function:
-   - key: main
-     handler: index.run
+     resource: main
+     render: native
+ resources:
+  - key: main
+    path: src/index.jsx
app:
  runtime:
    name: nodejs18.x
  id: ari:cloud:ecosystem::*******

and from my index.jsx,

import React, { useEffect, useState } from 'react';
import ForgeReconciler, { Text } from '@forge/react';

...

ForgeReconciler.render(
  <React.StrictMode>
    <App />
  </React.StrictMode>
);

This works!

2 Likes