
- #Expo dark mode switch how to
- #Expo dark mode switch code
You can also read the Expo doc about adding Gatsby support to an existing app.
Otherwise you can try to setup a monorepo, but keep in mind this requires more complex configuration, and Metro does not follow symlinks.
#Expo dark mode switch code
The most simple way to share code between an Expo app and a Gatsby site is currently to use a single folder for both the Expo app and the Gatsby app. Can I share the same repo to build a mobile app and a Gatsby site with shared components? You’d rather keep using platform-specific navigation trees (pages for Gatsby, and stacks/tabs for ReactNavigation).Įventually you could build your own cross-platform navigate() function, and your own cross-platform Link component (take a look at expo-gatsby-navigation). ReactNavigation may have web support, but Gatsby can’t use ReactNavigation config easily to construct static pages. This is not easy, because navigation patterns are different between web and mobile.
#Expo dark mode switch how to
How to share code for navigation/routing? You’ll also find support for Next if you need a static/SSR hybrid. It works fine for apps, but miss the various benefits of Gatsby, including performance, SEO, CMS integration, Gatsby-image…Īctually, this plugin uses the same webpack config as Expo web support, and Expo (Evan Bacon) contributed to this project.
Extracts critical react-native-web StyleSheet CSS during SSR and adds it to page.įAQ Expo already has web support, why do I need this?Įxpo web support is more like Create-React-App, it only outputs a single html file and does client side routing.
Creates support for Gatsby SSR with react-native-web. Uses which creates aliases for various React Native asset features and ensures that all React Native packages, and Unimodules are loaded with Babel. Implements module resolution for files with platform extensions like. Adds babel-preset-expo which manages tree-shaking of react-native-web packages. Import React from 'react' import Link from 'gatsby-link' import > Button Go to page 2 ) export default IndexPage Use ReactNativeWeb as a performant CSS-in-JS lib, like Twitter does. Document your ReactNative components with Docz. Blog about ReactNative, and include runnable RN demos directly in your MDX. Share a universal cross-platform design system between your mobile app and your marketing website. This project aims to “merge” Expo for web with Gatsby, so that you can build useful things like: There’s already Expo web, but it is not suited for a marketing website that needs JAMStack / SEO / CMS integration / Performance / Gatsby-image … WhyĬross-platform code is finally taking off, and it’s time to share more code between web and mobile. It’s just if you want to use Expo it’s already setup for you. Note: you don’t necessarily need to use Expo, plain regular React-Native-Web is fine. Universal SVG components using react-native-svg. Universal gesture systems with Animated, react-native-gesture-handler or Reanimated. Universal ReactNative design system libraries, like react-native-paper, react-native-ui-kitten, your own…. Expo unimodules with web support like expo-camera (check Expo doc for support). Primitive components from ReactNative (check RNW support). This means you can use components from the ReactNative ecosystem, directly on your Gatsby website. Adds React-Native-Web and Expo support to Gatsby.