LynxJS and NativeScript (Part 2) - Reuse existing native platform code

In Part 1, we looked at native module creation alone with LynxJS and NativeScript. In Part 2, let's look at one other distinctual aspect mentioned in their Native Module docs regarding reusing existing native platform code.

• Part 1: Native Module Creation
• → Part 2: Reuse existing native platform code

Or, you might want to reuse existing native platform code in your Lynx application.

Let's look at how NativeScript handles that.

Comparison in 1 Snapshot ​

Reuse existing native platform code with LynxJS ​

You can follow this documentation: https://lynxjs.org/guide/use-native-modules#platform=ios

Reuse existing native platform code with NativeScript ​

With NativeScript, reusing existing native platform code is perhaps one of it's greatest strengths in seamlessness.

iOS ​

You can configure nativescript.config.ts to include any platform code you already have. Refer to the documentation here.

For example, you can drop a Swift or Objective-C .h/.m/.modulemap right next to any TypeScript file:

// ...
ios: {
  NativeSource: [
    {
      name: 'ProjectPlatformSrc',
      path: './src/**/*.{swift,m,h,modulemap}'
    }
  ],
}

You can then run ns typings ios to get TypeScript declarations generated for those platform source files and just finish the project you're working on.

You could also include within App_Resources/iOS/src as mentioned in the docs here.

Additionally you might also include a App_Resources/iOS/Podfile with any Cocoapod needed, or configure nativescript.config.ts further to include Swift Packages if needed:

// ...
ios: {
  SPMPackages: [
    {
      name: 'DynamicColor',
      libs: ['DynamicColor'],
      repositoryURL: 'https://github.com/yannickl/DynamicColor',
      version: '5.0.0',
    }
  ]
}

Managing Swift Packages is outlined in the docs here.

Android ​

For Java and Kotlin files, you could add them directly to App_Resources/Android/src/main/java/com/company (or any reverse domain style Java-like package folder organization) and then use them from TypeScript using that exact same reverse domain style package.

Adding Java/Kotlin Code to an app is outlined in the docs here.

You may even have .jar or .aar file which you could generate TypeScript declarations from. This is touched on nicely in this blog post but also described in the docs here.

Additional Resources ​

Adding and reusing native platform code with a NativeScript project is detailed in the docs here.

NativeScript plugins also offer extensive coverage for native platform code reuse:

• https://docs.nativescript.org/plugins/
• https://github.com/nativescript-community

Various contributors also offer a wide array of diverse functionality which you can use or extend from to customize further:

• https://triniwiz.github.io/nativescript-plugins/api-reference/ffmpeg.html#installing

If nothing is found in any of the resources above, you could also dive into the vast React Native Module ecosystem and use Open Native to plug & play more.

Anecdotally, our team has proudly used react-native-auth0, an absolutely excellent native module, across NativeScript enterprise systems for 2 and half years now, ever since Open Native was first introduced.

Takeaways ​

LynxJS is really neat, check it out! Documentation: https://lynxjs.org/guide/start/quick-start.html

What would make it better? 🤔 To be able to use NativeScript with it.