README
React Native Electron
Electron extensions to React Native for Web
Introduction
This project aims to provide extensions to React Native for Web targeted to the Electron environment to support additional modules exposed by React Native (Alert
) or alternative implementations (Linking
) using Electron APIs.
Installation
npm install react-native-electron
electron
, react
and react-native-web
are required peer dependencies, make sure to install them as well:
npm install electron react react-native-web
react-art
is also needed if you use ART
.
Electron setup
In order for the APIs exposed by react-native-electron
to be accessible in Electron's render process, the following setup must be applied:
- The
react-native-electron/main
module must be imported in the main process BrowserWindow
instances must be created with thepreload
script fromreact-native-electron/preload
, for example:
webPreferences: {
preload: require('path').resolve(
require.resolve('react-native-electron/preload'),
),
},
Example
See the example
directory for the source code and Webpack config.
To run the demo app, fork this repository and run the following commands in the root folder:
yarn install
yarn build
Then in the example
folder:
yarn install
yarn start
Usage with Expo application
This module can be used with Expo application (created by expo-cli
) using the following steps:
- Follow this guide's setup
- Run
yarn expo-electron customize
in order to eject expo-electron's webpack configuration - Edit
./electron/webpack.config.js
as follows:
const { withExpoWebpack } = require('@expo/electron-adapter')
module.exports = (config) => {
const expoConfig = withExpoWebpack(config)
expoConfig.resolve.alias['react-native