Conditionally require a NativeScript plugin when only a single platform is supported

Nathan Walker
InstructorNathan Walker

Share this video with your friends

Send Tweet
Published 5 years ago
Updated 3 years ago

Sometimes a NativeScript plugin may only support 1 platform (iOS or Android). In these cases, we will want to conditionally require the plugin to ensure we don’t crash the other unsupported platform. Let’s consider view and service level implications for how best to handle these scenarios.

[00:00] If try to implement this EZAudio plugin into our project, with this plugin installed if we go to our app component, and make sure we've registered the element for this plugin using the register element API to register AudioPlot coming from the EZAudio plugin.

[00:15] We add that component to our view, and then run this against Android. You will receive a nasty crash. It says could not load view for AudioPlot with a failed defined module of the EZAudio plugin.

[00:28] If we look through the build of our app, we'll see that, in fact, it does output that NativeScript EZAudio is not supported for Android.

[00:35] In these cases, you will want to make sure that any time you require or import a module or plugin that is only supported on one platform, that you wrap this with a conditional for that platform only. Let's use the isIOS Boolean from NativeScript's platform module, and wrap the registration of this element in isIOS.

[00:57] In our view template, we want to make sure that this component is wrapped with the iOS node, to flag that this is only supposed to be shown on iOS.

[01:07] For Android, we could use the Android node and place a different component implementation. This could either be another plugin, or even a custom implementation using one of the layout containers like the grid-layout. For example, we'll just say label, and we'll put a todo here, and now when we run this on Android it runs without error.

[01:28] Just to elaborate, if you had an Angular service that needed to tap into platform specific classes, you would want to take the same thing into consideration. Take, for example, the EZAudio plugin, and the Audio plugin which is cross-platform compatible.

[01:43] If we wanted to use the EZRecorder and EZAudio player from this iOS-specific plugin, we could define these variables up top, and then assign them to the appropriate class that we require in.

[01:56] The downside is we do not get our types imported from the module, but this will allow you to get around a platform specific implementation.