Web Support
Moti works on all platforms, including web. Make sure you've installed react-native-web
and done anything you need to get that working.
#
Expo Web supportSince Moti uses Reanimated 2, we need its Babel plugin to be applied to Moti. Since Expo Web doesn't transpile modules by default, we'll need to tell it to transpile Moti.
Create a custom webpack.config.js
in the root of your Expo app, and paste the contents below:
webpack.config.js
Your app will now run with Expo Web!
#
Other React Native Web setupsIf you're using a different web solution, make sure that Babel knows to transpile Moti. You might need to create a webpack.config.js
file like this:
yarn add -D babel-loader
I'm no Webpack expert, so consider this a hack. If you know the right solution for this file, please let me know and open a PR!
#
Known issues#
Spring animationsIn my experience, reanimated 2's spring animations are glitchy on web. I recommend using timing
animations for now.
You can configure your animation settings using the transition
prop of any Moti component.