如何调试未找到的导入绑定名称

Question

我有一个 NativeScript 应用程序，我正在尝试添加 iBeacon 支持以使用 iBeacon 插件。该应用程序成功构建并同步到我的手机（我正在使用 SideKick）。当应用程序运行时，它有一个致命的 javascript 异常。 javascript错误报告在：

file:///app/tns_modules/tns-core-modules/ui/builder/builder.js:244:56: JS ERROR Error: Building UI from XML. @file:///app/app-root.xml:18:9

该行是定义尝试访问 iBeacon 代码的页面的位置：

<Frame defaultPage="views/search/search-page"></Frame>

具体的错误是：

Importing binding name 'BeaconLocationOptions' is not found.

我假设这是作为以下导入语句的一部分发生的：

import {NativescriptIbeacon, BeaconCallback, BeaconLocationOptions, BeaconLocationOptionsIOSAuthType, BeaconLocationOptionsAndroidAuthType, BeaconRegion, Beacon } from 'nativescript-ibeacon';

上述导入语句是 iBeacon 文档的一部分。

我的项目中node_modules下有一个nativescript-ibeacon目录。具体的ios文件好像有：

/Users/edscott/NativeScript/beacon-test/node_modules/nativescript-ibeacon/nativescript-ibeacon.ios.js

我不确定这是我的代码有问题还是配置有问题 - 可能是缺少某些东西导致 ibeacon 文件无法正确部署到设备。

我的代码是 javascript，但我已经安装了 typescript 插件。看起来这个 iBeacon 插件假定应用程序是用 typescript 编写的。

我正在寻求帮助，以确定下一步要尝试什么。

仅供参考...我已尝试将源文件从 node_modules 中拉出并将它们直接合并到我的项目中。在用这种方法解决了许多问题后，我最终遇到了同样的问题——在设备上运行时导入代码的问题。

下面是使用 iBeacon 插件的代码：

const observableModule = require("tns-core-modules/data/observable");
import {NativescriptIbeacon, BeaconCallback, BeaconLocationOptions, BeaconLocationOptionsIOSAuthType, BeaconLocationOptionsAndroidAuthType, BeaconRegion, Beacon } from 'nativescript-ibeacon';

function SearchViewModel() {

    let callback = {
        onBeaconManagerReady() {
            // start ranging and/or monitoring only when the beacon manager is ready
            this.nativescriptIbeacon.startRanging(this.region);
            this.nativescriptIbeacon.startMonitoring(this.region);
        },
        didRangeBeaconsInRegion: function(region, beacons) {
            console.log("didRangeBeaconsInRegion");
        },
        didFailRangingBeaconsInRegion: function(region, errorCode, errorDescription) {
            console.log("didFailRangingBeaconsInRegion");
        }
    };

    let options = {
        iOSAuthorisationType: BeaconLocationOptionsIOSAuthType.Always,
        androidAuthorisationType: BeaconLocationOptionsAndroidAuthType.Coarse,
        androidAuthorisationDescription: "Location permission needed"
    };

    let nativescriptIbeacon = new NativescriptIbeacon(callback, options);

    let region = new BeaconRegion("HelloID", "2f234454-cf6d-4a0f-adf2-f4911ba9ffa6");

    const viewModel = observableModule.fromObject({
        "beaconData": "not set yet",  

        "onTapStart": function() {
            this.set("beaconData", "started");
            console.log("tapped start");

            if (!nativescriptIbeacon.isAuthorised()) {
                console.log("NOT Authorised");
                nativescriptIbeacon.requestAuthorization()
                    .then(() => {
                        console.log("Authorised by the user");
                        nativescriptIbeacon.bind();

                    }, (e) => {
                        console.log("Authorisation denied by the user");
                    })
            } else {
                console.log("Already authorised");
                nativescriptIbeacon.bind();
            }            
        },

        "onTapStop": function() {
            this.set("beaconData", "stopped");
            console.log("tapped stop");

            nativescriptIbeacon.stopRanging(region);
            nativescriptIbeacon.stopMonitoring(region);
            nativescriptIbeacon.unbind();
        }
    });

    return viewModel;
}

module.exports = SearchViewModel;

Answer 1

我为你创建了一个游乐场here。

如果您查看示例，我将从主文件夹导入 NativescriptIbeacon，并从公共文件夹中导入。

附：这个插件依赖于nativescript-permission

import { NativescriptIbeacon } from '../nativescript-ibeacon';
import {
    BeaconRegion, Beacon, BeaconCallback,
    BeaconLocationOptions, BeaconLocationOptionsIOSAuthType, BeaconLocationOptionsAndroidAuthType
} from "../nativescript-ibeacon/nativescript-ibeacon.common";

---

这个答案与另一个修改一起解决了我的问题。拆分导入后，我仍然遇到同样的错误。然后我阅读了以下关于模块的页面： https://docs.nativescript.org/core-concepts/android-runtime/getting-started/modules 基于此声明：

如果传递给 require(moduleName) 的模块标识符没有开始 使用 '/'、'../' 或 './'，NativeScript 将查找模块 在 tns_modules 文件夹中

我假设可能只需要正确查找 tns_modules。 我将 import 重构为使用 require ，这很有效。我的更改如下。可能有更有效的方法来做到这一点，但它对我有用。

const nsb = require("nativescript-ibeacon/nativescript-ibeacon.js");
const nsbc = require("nativescript-ibeacon/nativescript-ibeacon.common.js");
const NativescriptIbeacon = nsb.NativescriptIbeacon;
const BeaconCallback = nsbc.BeaconCallback;
const BeaconLocationOptions = nsbc.BeaconLocationOptions;
const BeaconLocationOptionsIOSAuthType = nsbc.BeaconLocationOptionsIOSAuthType;
const BeaconLocationOptionsAndroidAuthType = nsbc.BeaconLocationOptionsAndroidAuthType
const BeaconRegion = nsbc.BeaconRegion;
const Beacon = nsbc.Beacon;