Flare-React
Flare-React copied to clipboard
No sign of FlareComponent getting rendered
I'm using my animation in a react app and I used the following code to add my animation
render={data => (
<OuterContainer>
<Container>
<NameHeader>{data.site.siteMetadata.title}
<FlareComponent width="200" height="200" animationName="green" file="light.flr" />
</NameHeader>
<Description>{data.site.siteMetadata.subtitle}</Description>
</Container>
</OuterContainer>
)}
I checked the Component with my React Developer tool and this is what I found in my FlareComponent
The console showed me the following error
SyntaxError: JSON.parse: unexpected character at line 1 column 1 of the JSON data FlareReact.js:9534
Here is my React file for a reference.
You can also find the flare files(I tried it with both Binary and JSON) in the components
directory of the repo
Try importing it like - import minion from './minion.flr'
@obitodarky one thing about the CRA is that, file paths other than used in import/export must be relative to public/ folder because after build process, your final js is filled all into index.html by webpack in the CRA....
When browser renders index.html its assumes that there must './minion.flr' in the same folder as index.html that is inside of public folder..
So place your minion.flr file in public folder and Enjoy!!!