Cross-platform (xplat) tools for Nx workspaces
![](https://raw.githubusercontent.com/nstudio/xplat/master/xplat-logo.png)
xplat is an added value pack for Nx which provides additional app generators and optional supporting architecture for different platform/framework combinations.
Currently supported platforms
- Electron
Build cross platform desktop apps with JavaScript, HTML, and CSS.
- Ionic
Build amazing apps in one codebase, for any platform, with the web.
- NativeScript
Build rich iOS and Android apps with direct access to native api's from JavaScript directly.
Quickstart
npx create-nx-workspace@latest
At the prompts:
What to create in the new workspace
choose apps
npm i @nstudio/xplat -D
You are now ready to create apps:
nx g app
NOTE: If you encounter any issue, you can try creating an Nx workspace with version specified, for example:
npx create-nx-workspace@14.1.7
App generation examples
The additional app generators can be used as follows:
Electron
Electron app generator can use any web app in the workspace as it's target.
If you don't have a web app yet, create one first:
nx g app sample
choose web
You can now use the web app as the Electron target:
nx g app desktop --target=web-sample
choose electron
Develop with:
npm run start.electron.desktop
Ionic
nx g app sample
choose ionic
Develop in browser with:
nx serve ionic-sample
Build Ionic app:
nx build ionic-sample
A. Capacitor iOS - Prepare for development
npm run prepare.ionic.sample.ios
You can now open in Xcode for further development:
npm run open.ionic.sample.ios
B. Capacitor Android - Prepare for development
npm run prepare.ionic.sample.android
You can now open in Android Studio for further development:
npm run open.ionic.sample.android
NativeScript
nx g app mobile
choose nativescript
A. iOS
nx run nativescript-mobile:ios
B. Android
nx run nativescript-mobile:android
Documentation
Talks
Example repos for different scenarios
Context