从“@ionic-native 设备”导入 { Device }；不工作

当你使用Ionic框架时，可能会遇到从“@ionic-native设备”导入{Device}的问题无法运行的情况。这是由于一些常见的问题导致的，本文将为您解决此问题。

问题描述

在Ionic应用程序中，您可能需要使用到Ionic Native的设备插件作为您的应用程序的一部分，例如获取设备的UUID或平台信息。通常，您需要从“@ionic-native/device”中导入Device并使用它来访问这些信息。

import { Device } from '@ionic-native/device';

@Component({...})
export class MyPage {
  constructor(private device: Device){ 
    let uuid = this.device.uuid;
    console.log('Device UUID is: ' + uuid);
  }
}

但您最终可能会遇到该问题：

TS6194: Can't resolve '@ionic-native/device' from './some.component.ts'.

解决方案

这个问题有很多种可能的原因，本文将会讨论其中三种最常见的原因。

1. 缺少依赖

确保你已经在你的应用程序安装了Ionic Native插件：

npm install @ionic-native/device

2. 模块路径不正确

如果您的文件路径不正确，可能会导致导入文件无法正常工作。确保在导入设备模块时，您已经给出了正确的路径。

import { Device } from '@ionic-native/device'; // 正确
import { Device } from 'ionic-native'; // 不正确

3. angular.json 配置问题

该问题也有可能来自于angular.json配置不正确。确保您在angular.json文件的"scripts"部分中引用了cordova.js。

"scripts": [
  "node_modules/ionic/dist/js/ionic.bundle.js",
  "node_modules/@ionic-native/core/dist/ionic-native.js",
  "cordova.js", // 将其添加到这里
  "src/scripts/main.js"
]

结论

通过检查缺少依赖、模块路径和angular.json配置等常见问题，您将能够成功导入设备模块并使用Ionic Native的设备插件。希望本文能够解决您的问题并帮助您更好地使用Ionic框架。