Hi there, I’m using the code snippets to embed my notebook in react. However, when I run ‘yarn start’ I get a ‘failed to compile error’ complaining about the fileattachments. I did follow these instructions, also provided in embed window but it did not seem to solve the issue. For file attachment…

hi @mbrownshoes if you’re using create-react-app you might want to look at this thread [image] Zoomable Sunburst d3 chart with react Here’s a working demo you can check out: The main wrinkle here is that create-react-app doesn’t support the standard import.meta syntax…

Interesting, so I keep running into this error now, even when I try embedding using the zoomable-sunburst example chart = RuntimeError: Unexpected token < in JSON at position 0 this is after I implemented this change const fileAttachments = new Map([["flare-2.json","/flare-2.json"]]);

[image] mbrownshoes: chart = RuntimeError: Unexpected token < in JSON at position 0 weird, seems like there is something wrong with the content on your json file. Did you download it and move to public/ ?

I put the notebook code here: src/@d3/zoomable-sunburst as described in: https://github.com/observablehq/react-zoomable-sunburst Ah, so I see when I download the code there is no json file and in the above repo I don’t see where he has put the flare.json file, so not sure how it is supposed to wo…

How are you downloading and unzipping your tarball? Apparently there are some issues with different zip software: [image] Use of download code ? Community Help Thanks Cobus, The file/folder you mention does not show in the Download Code .tgz file for the Parallel Sets S…

the json file doesn’t not come with a .json extension [image] do you see the same files?

[image] radames: the json file doesn’t not come with a .json extension … and if that annoys you, be sure to add your voice to [image] What's your method to compress FileAttachements? Site Feedback When exporting a notebook that contains a FileAttachment, the files a…

Yes, I do, and correct there is no json extension.

Oh weird, yes if I download using the Download Code button and use unarchiver to unzip the files do not show. If I use yarn add then the files are downlaoded but with no extension.

If I change the extension to .json and the update the code to const fileAttachments = new Map([["flare-2.json",require("./files/e65374209781891f37dea1e7a6e1c5e020a3009b8aedf113b4c80942018887a1176ad4945cf14444603ff91d3da371b3b0d72419fa8d2ee0f6e815732475d5de.json")]]) I still see a RuntimeError: …

Embedding in react, issue with fileattachments/babel

Community Help

mootari November 19, 2020, 12:05pm 10

… and if that annoys you, be sure to add your voice to

3 Likes

Topic		Replies	Views
embedding a notebook --> import.meta Community Help	3	1145	September 19, 2020
how do i embed the notebook in react Community Help	6	1653	May 27, 2021
Gatsby static blog template with content from observable Community Help	9	1880	November 26, 2021
Embed chart in a React App Community Help	9	109	January 22, 2026
File attachments! Announcements	50	8652	September 2, 2021

Embedding in react, issue with fileattachments/babel

Related topics