Features

One is a complete solution to cross-platform development with React and React Native. We're experimenting with a features document to offer a high-level overview of One.

See the Status document for the status of features.

Vite

The One Vite Plugin automates away much of the setup & boilerplate required for cross-platform React Native & web development.

Out of the box, the One Vite plugin does the following:

• Sets up a file system router in the ./app folder
• Generates types for routes and updates them when routes change
• Enables loaders and tree shakes them out on client. Using the amazing babel-dead-code-elimination module
• Enables the deps option that allows for easy node_module patching
• Swaps between React 18 for native and React 19 for web
• Adds vite-tsconfig-paths plugin, unless it detects you've added it already
• Loads .env file into process.env before running anything using dotenv
• Adds a well-configured tsconfig.json if it doesn't exist
• Configures native to resolve "react-native" export field in package.json
• Configures platform-specific extensions web|native|ios|android for extensions ts|tsx|js|mjs, eg .ios.ts
• Adds a ssr-css plugin that enables perfect dev-mode CSS on first load, matching production
• Configures a wide variety of optimizeDeps presets for React Native library compatibility
• Patches a large number of known-bad node_modules to work with Vite
• Ensures optimized deps across all routes are found before first load, avoiding hard reloads and slow loads in development mode

Universal

• Uses React Navigation routing and truly native layouts
• Adds loaders that work on native and web
• Adds a Link component for navigation
• Adds a wide variety of hooks for routing
• Adds react-native-safe-area-context and exports SafeAreaView

Native

• Implements a custom bundle output with React Native compatible commonjs
• Implements custom hot reloading that works with commonjs
• Implements a custom bridge to React Native for debug logging
• Implements logic to support importing assets, like images

Web

• Adds serve command that sets up a Hono server for production
• Implements SPA, SSG, and SSR style routing on a per-page and global basis
• Server rendering - find JS and CSS for all nested routes and layouts and hoists it to header to avoid waterfalls and flickering
• Automatically preloads next page JS when hovering a link or navigating to a new route, including loaders
  • Doesn't require up-front route map so no scaling cost
• Automatically handles scroll restoration and allows configuration
• Adds an easy redirects option
• Adds generateStaticParams export for SSG and SSR routes
• Implements API routes
• Adds a page loading progress bar
• Swaps query-string and url-parse libraries to save ~20Kb
• Adds a Redirect component

Extras

• Exports a variety of helpful utility functions
• Analyze your web client-side bundle with VXRN_ANALYZE_BUNDLE=1
• Guide for MDX support
• Guide for light and dark mode

Edit this page on GitHub.