Issue with blockly integration with react

[Pooja Kushwah]

Hi Team,

I tried to integrate Blockly with my React application. So first I tried the sample project.

I did not made any other changes but still it is throwing me some error also not proper lists of blocks are coming.

could you please help me with any documentation which i can refer and analyse what is going wrong and what all things are required.

Thanks in advance.

Regards,

Pooja Kushwah

[Maribeth Bottorff]

Hello, can you provide more information about how you are running the sample? I can't reproduce this issue. Here are the steps I followed:

1. cd blockly-samples/examples/blockly-react

2. npm install --force (we have some peer dependency issues we should fix, but they don't matter for this demo)

3. npm run start

The browser opens and the React demo is displayed correctly. Please provide more information and we'll try to help you.

As a related note, you might want to check out the react-blockly project which provides a more full-featured React component or hook for your application. The demo in samples is pretty bare-bones and you'd have to do a lot of React-related setup yourself, and the core team doesn't really have the React experience needed to help you debug any problems.

Maribeth

[Abhishek Vrutti Tech]

I am also facing the same issue when I run Blockly's official example for reactjs, it worked but when I created a new project and copied all the project files including package.json and package-lock.json files in my new project ( after trying all possible soln ), I am getting the same error when I try to delete the block from the canvas by any method like dropping it in the toolbar, or dropping it on trash bin or right click and delete block option. 

I am not able to find any soln to this issue, So can you please help me to find soln?

[Abhishek Vrutti Tech]

This is the code that I took from Blockl'y official Examples for ReactJs.

https://drive.google.com/file/d/1X1hNut2qsClwzRvE90Dsk9-FU9hPKdlm/view?usp=sharing

Abhishek

[Maribeth Moffatt]

Hi, it seems like this error is occurring because the sound files can't be found. The default location of the media file points to our hosted version online, but you can change the location Blockly will try to load the files from by setting the `media` option when you inject Blockly. You could host these on your own server and point to that location instead. We do ship them with the Blockly package inside the `media/` directory, but you'd need to configure your server to host them at a specific location, then point to that same location within your inject options.

I hope that helps!

Maribeth