https://github.com/nativescript/ns-embed-example
Embed NativeScript screens into platform host (Swift, Objective-C, Kotlin or Java based) projects.
https://github.com/nativescript/ns-embed-example
Last synced: about 1 year ago
JSON representation
Embed NativeScript screens into platform host (Swift, Objective-C, Kotlin or Java based) projects.
- Host: GitHub
- URL: https://github.com/nativescript/ns-embed-example
- Owner: NativeScript
- Created: 2024-07-03T02:50:27.000Z (almost 2 years ago)
- Default Branch: main
- Last Pushed: 2024-07-10T20:11:24.000Z (almost 2 years ago)
- Last Synced: 2025-04-09T03:15:59.645Z (about 1 year ago)
- Language: TypeScript
- Homepage:
- Size: 854 KB
- Stars: 4
- Watchers: 3
- Forks: 0
- Open Issues: 3
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
## Embed NativeScript Example
*Note: Requires NativeScript 8.8*
```bash
npm install -g nativescript
```
### host-ios-project
A Swift iOS project which embeds NativeScript screens.
### host-android-project
A Kotlin Android project which embeds NativeScript screens.
### nativescript-project-*
- ng: Angular based NativeScript project.
- react: React based NativeScript project.
- solid: Solid based NativeScript project.
- svelte: Svelte based NativeScript project.
- vue: Vue based NativeScript project.
## Try it
See `nativescript-project-`*/`nativescript.config.ts` for the host project path settings the `embed` command uses.
```bash
cd nativescript-project-{ng|react|solid|svelte|vue}
ns embed ios
// or...
ns embed android
```
Now open each respective host project, `host-ios-project` in Xcode and `host-android-project` in Android Studio.
### For iOS:
1. Xcode File > 'Add Package Dependencies...' and type in this URL https://github.com/NativeScript/ios-spm to add the NativeScriptSDK.
2. Modify `ViewController.swift` to specify the name of the embedded project:
```swift
@IBAction func openMyNativeScriptApp(_ sender: Any) {
// modify the appFolder to point to your NativeScript app
// ng: nativescriptprojectng/app
// react: nativescriptprojectreact/app
// solid: nativescriptprojectsolid/app
// svelte: nativescriptprojectsvelte/app
// vue: nativescriptprojectvue/app
self.setupNativeScript(appFolder: "nativescriptprojectng/app")
}
```
3. Copy Metadata from `nativescript-project-*/platforms/ios/build/Debug-iphonesimulator/metadata-arm64.bin` to `host-ios-project/nativescriptproject*`
Now build and run.
*Note: You can also change the project name/folder of the NativeScript project by setting `projectName` to any you prefer in `nativescript.config.ts`.*