2. The animation is not rendered at all in my app
Check that the JSON file containing the animation is placed within the React Native app project folder structure and is reachable through an import/require
statement in the component in which the animation should be rendering. To test this, you can console.log
the contents of the JSON file; if they log as undefined
, it means that the file was not reachable by the component:
const animation = require('./assets/animations/loadingBar.json')
console.log(animation)
In this case, you might want to move the JSON file to a different folder or try with a different JSON file, as it's possible the file was damaged or inconsistent. Using a JSON linter can help to identify and fix this kind of issue.