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

时间:2019-03-27 21:31:06

标签: nativescript

我有一个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';

上面的import声明是iBeacon文档的一部分。

在我的项目中的node_modules下有一个nativescript-ibeacon目录。特定的ios文件似乎在那里:

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

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

我的代码在javascript中,但是我已经安装了typescript插件。看起来这个iBeacon插件假定该应用程序是用打字稿编写的。

我正在寻找确定下一步尝试的帮助。

仅供参考...我尝试将源文件从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;

1 个答案:

答案 0 :(得分:0)

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

如果您查看示例,我将从主文件夹中导入NativescriptIbeacon,然后从公用文件夹中导入其余部分。

P.S。此插件依赖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;