"BLE Communication in React Native Windows: Issues with Native C++ Module"

[mayuripore973]

Problem Description

I am developing a React Native Windows application with BLE communication using a custom C++ native module. However, I am encountering build errors and issues with module registration.

Environment Details :
React Native Version: 0.75.5
React Native Windows Version: 0.75.13
C++ Compiler: MSVC (VS 2022)
OS: Windows 10
Bluetooth Library Used: (Windows.Devices.Bluetooth API)

I Implemented a BleModule in C++ as a native module.
Registered the module using REACT_MODULE(BleModule).
Attempted to include the module in ReactPackageProvider.cpp.
Ensured the necessary dependencies were installed.

Steps To Reproduce

• Code which I have tried :

// BleModule.h
#pragma once
#include "NativeModules.h"
#include <winrt/Windows.Devices.Bluetooth.h>
#include <winrt/Windows.Devices.Bluetooth.GenericAttributeProfile.h>
#include <winrt/Windows.Devices.Enumeration.h>

namespace winrt::SampleApp::implementation {

// Declare the module to React Native
REACT_MODULE(BleModule)
struct BleModule {
// Default constructor (needed for React Native Windows)
BleModule() = default;

// Constructor with React Context
BleModule(winrt::Microsoft::ReactNative::IReactContext const& reactContext);

REACT_METHOD(StartScan);
void StartScan();

REACT_METHOD(ConnectToDevice);
void ConnectToDevice(std::string deviceId);

private:
winrt::Microsoft::ReactNative::IReactContext m_reactContext{ nullptr };
};

}

// BleModule.cpp
#include "pch.h"
#include "BleModule.h"

using namespace winrt;
using namespace Windows::Devices::Enumeration;
using namespace Windows::Devices::Bluetooth;

namespace winrt::SampleApp::implementation {

// Default constructor (needed for React Native Windows)
BleModule::BleModule() {}

// Constructor to store React context
BleModule::BleModule(winrt::Microsoft::ReactNative::IReactContext const& reactContext)
: m_reactContext(reactContext) {}

void BleModule::StartScan() {
DeviceWatcher watcher = DeviceInformation::CreateWatcher(
BluetoothLEDevice::GetDeviceSelector());

watcher.Added([this](DeviceWatcher sender, DeviceInformation deviceInfo) {
    auto deviceName = deviceInfo.Name().c_str();
    if (m_reactContext) {
        m_reactContext.CallJSFunction(
            L"RCTDeviceEventEmitter", L"emit", L"onDeviceFound", deviceName);
    }
});

watcher.Start();

}

void BleModule::ConnectToDevice(std::string deviceId) {
auto asyncOp = BluetoothLEDevice::FromIdAsync(winrt::to_hstring(deviceId));
asyncOp.Completed([this](auto const& asyncInfo, auto const& status) {
if (status == Windows::Foundation::AsyncStatus::Completed) {
auto device = asyncInfo.GetResults();
if (device && m_reactContext) {
m_reactContext.CallJSFunction(
L"RCTDeviceEventEmitter", L"emit", L"onDeviceConnected", device.Name().c_str());
}
}
});
}

}

// ReactPackageProvider.cpp
#include "pch.h"
#include "ReactPackageProvider.h"
#include "NativeModules.h"
#include "BleModule.h" // Ensure this is included

using namespace winrt::Microsoft::ReactNative;

namespace winrt::SampleApp::implementation
{

void ReactPackageProvider::CreatePackage(IReactPackageBuilder const &packageBuilder) noexcept
{
AddAttributedModules(packageBuilder, true);
packageBuilder.AddModule<L"BleModule">();
}

}

Errors :

Build failed with message C:\React-Native Projects\sample_app\node_modules\react-native-windows\Microsoft.ReactNative.Cxx\NativeModules.h(984,54): error C2027: use of undefined type 'winrt::Microsoft::ReactNative::ModuleMethodInfo' [C:\React-Native Projects\sample_app\windows\SampleApp\SampleApp.vcxproj]. Check your build configuration.
Command failed. Re-run the command with --logging for more information.

Can we add classes in C# instead of C++ in windows project and register C# classes ?
Do I need additional steps to expose the module correctly?
Is there a specific way to debug module loading in React Native Windows?
Any references or working examples would be helpful.

Expected Results

Expected Outcome :
I expect my C++ BleModule to be recognized and registered properly in React Native Windows, allowing JavaScript to call its methods.

CLI version

15.0.1

Environment

System:
  OS: Windows 10 10.0.19044
  CPU: (8) x64 11th Gen Intel(R) Core(TM) i5-1135G7 @ 2.40GHz
  Memory: 8.32 GB / 15.75 GB
Binaries:
  Node:
    version: 22.11.0
    path: C:\Program Files\nodejs\node.EXE
  Yarn:
    version: 3.6.4
    path: C:\Program Files (x86)\Yarn\bin\yarn.CMD
  npm:
    version: 10.9.1
    path: C:\Program Files\nodejs\npm.CMD
  Watchman: Not Found
SDKs:
  Android SDK:
    API Levels:
      - "28"
      - "29"
      - "30"
      - "31"
      - "32"
      - "33"
      - "34"
      - "34"
      - "34"
      - "35"
    Build Tools:
      - 28.0.3
      - 29.0.2
      - 29.0.3
      - 30.0.1
      - 30.0.2
      - 30.0.3
      - 31.0.0
      - 32.0.0
      - 33.0.0
      - 33.0.1
      - 34.0.0
      - 35.0.0
      - 36.0.0
      - 36.0.0
    System Images:
      - android-30 | Google APIs Intel x86 Atom
      - android-34 | Google APIs Intel x86_64 Atom
      - android-34 | Google Play Intel x86_64 Atom
    Android NDK: 22.1.7171670
  Windows SDK:
    AllowDevelopmentWithoutDevLicense: Enabled
    AllowAllTrustedApps: Enabled
    Versions:
      - 10.0.17763.0
      - 10.0.18362.0
      - 10.0.19041.0
      - 10.0.20348.0
      - 10.0.22621.0
      - 10.0.26100.0
IDEs:
  Android Studio: AI-212.5712.43.2112.8609683
  Visual Studio:
    - 17.13.35818.85 (Visual Studio Community 2022)
Languages:
  Java: 17.0.13
  Ruby: Not Found
npmPackages:
  "@react-native-community/cli":
    installed: 15.0.1
    wanted: 15.0.1
  react:
    installed: 18.3.1
    wanted: 18.3.1
  react-native:
    installed: 0.75.5
    wanted: ^0.75.5
  react-native-windows:
    installed: 0.75.13
    wanted: 0.75.13
npmGlobalPackages:
  "*react-native*": Not Found
Android:
  hermesEnabled: true
  newArchEnabled: true
iOS:
  hermesEnabled: Not found
  newArchEnabled: Not found

Community Modules

"dependencies": {
"@react-navigation/native": "^7.0.14",
"react": "18.3.1",
"react-native": "^0.75.5",
"react-native-fs": "^2.20.0",
"react-native-sqlite-2": "^3.6.2",
"react-native-sqlite-storage": "^6.0.1",
"react-native-windows": "0.75.13"
},

Target Platform Version

None

Target Device(s)

No response

Visual Studio Version

None

Build Configuration

None

Snack, code example, screenshot, or link to a repository

No response

[acoates-ms]

I'm not sure about your specific build errors. But some comments:

You shouldn't have another constructor that takes a ReactContext. Instead you should use REACT_INIT to mark a function which will get the ReactContext passed into it.

Your REACT_METHOD methods should be marked noexcept.

You shouldn't need the packageBuilder.AddModule<L"BleModule">(); line, since the AddAttributedModules(packageBuilder, true); line above it would register the BleModue.