Package Exports
- @expo/electron-adapter
- @expo/electron-adapter/package.json
This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (@expo/electron-adapter) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.
Readme
👋 Welcome to
@expo/electron-adapter
Create Desktop apps with Expo and Electron!
This package wraps electron-webpack
and adds support for Expo web and other universal React packages.
🏁 Setup
Install the package in your project:
yarn add @expo/electron-adapter
Create a new
electron-webpack
config file:touch ./electron-webpack.js
Replace the contents of your config with the following:
electron-webpack.js
const { withExpoAdapter } = require('@expo/electron-adapter'); module.exports = withExpoAdapter({ projectRoot: __dirname, // Provide any overrides for electron-webpack: https://github.com/electron-userland/electron-webpack/blob/master/docs/en/configuration.md });
⚽️ Usage
Starting a project
- Start the project with
yarn expo-electron start
- Currently this is just an alias for the following script:
ELECTRON_DISABLE_SECURITY_WARNINGS=1 electron-webpack dev
ELECTRON_DISABLE_SECURITY_WARNINGS=1
disables the useless warnings in your project.
- Currently this is just an alias for the following script:
Customizing the main process
- To reveal the main process (highly recommended) use:
yarn expo-electron customize
- This will generate the
electron/main/
andelectron/webpack.config.js
files for you to customize. - Everything running in the
electron/main/
folder is on a different process to the rest of your app. Think of this like the native code in the Expo Client app (but not really because it's JavaScript and easy).
- This will generate the
- To revert back to the default main process or reset to the latest default template simply delete the
electron/
folder and the adapter will go back to using the hidden version.
Building your project
@expo/electron-adapter
doesn't do anything to streamline building Expo Electron projects just yet. But until it does here is a guide for building projects using electron-builder
.
- Install the package with
yarn add -D electron-builder
- Use the builder with:
yarn electron-webpack && yarn electron-builder --dir -c.compression=store -c.mac.identity=null
(-c.compression=store
speeds the builds up a lot, delete this for actual production builds) - Learn more about configuring your build here: Configuring electron-builder
🥨 Behavior
- Expo resolves files with
.electron.js
&.web.js
extensions in that order. If you want to useelectron
features then put them in a file likefoo.electron.js
. - Every universal package you have installed will be transpiled automatically, this includes packages that start with the name:
expo
,@expo
,@unimodules
,@react-navigation
,react-navigation
,react-native
. You can add more by appending them to the array for keyexpo.web.build.babel.include
in yourapp.json
(this feature is experimental and subject to change).
License
The Expo source code is made available under the MIT license. Some of the dependencies are licensed differently, with the BSD license, for example.