Hi, I’m trying to embed the ohif v3.9 (current master branch) viewer into a separate react application using an iframe. I’m using vite to create the react app.
When I use the build output folder named ‘ohif’ found in the zip folder provided by the documentation here, I can get the viewer to show up by putting that build output file in the root project of my directory and giving my App.tsx file an iframe with src=“../ohif/”, and as far as I can tell it has full functionality as I have also added in the appropriate headers to the vite config file to enable Cross Origin Isolation.
However, when I try to build the app myself from a cloned github repo on my local machine, and use that dist file in the root directory of my react app, I just get a black screen and an error message in the console saying: Uncaught SyntaxError: Cannot use import statement outside a module.
I’ve been building the ohif from the /platform/app directory, and have also tried from the root directory and /platform/app/src directory.
After following the steps outlined here, I changed the routerBasename to ‘/ohif’ in the default.js config file and then ran the following commands .
$env:NODE_ENV="production"
$env:PUBLIC_URL="/ohif/"; $env:APP_CONFIG="config/default.js"; yarn build
I am wondering if I am somehow building the project incorrectly, and would like to know how that example ohif build output folder was created that was provided in the docs, as that one seems to work for me. I’ve been stuck on this on and off for a few weeks now and would appreciate it if someone could give me a little guidance.
Thanks