使用步骤
首先确定你的ionic工程的版本,ionic3与ionic4对该插件的使用方法有些许区别 (PS:特别提示,其他官网上提到的插件也会有类似区别,注意举一反三)
1.添加插件
//ionic3工程下
$ ionic cordova plugin add cordova-plugin-app-version
$ npm install --save @ionic-native/app-version@4
//ionic4工程下
$ ionic cordova plugin add cordova-plugin-app-version
$ npm install @ionic-native/app-version
2.将插件导入到app module里面去
// app.module.ts
//ionic3工程下
import { AppVersion} from '@ionic-native/app-version';
//ionic4工程下
//import { AppVersion } from '@ionic-native/app-version/ngx';
...
@NgModule({
...
providers: [
...
AppVersion
...
]
...
})
export class AppModule { }
3.在调用界面实现如下代码进行调用
//ionic3工程下
import { AppVersion } from '@ionic-native/app-version';
//ionic4工程下
//import { AppVersion } from '@ionic-native/app-version/ngx';
...
export class HomePage {
constructor(private appVersion: AppVersion) {
this.appVersion.getVersionNumber().then(res=>{
console.log(res);
});
}
需要注意的是:
1.如果不是一个空工程的话,需要将node_modules删除重新添加;
2.程序需要真机运行,否则会报cordova_not_available的错误。为了你的代码可以在浏览器中测试,可以加入如下判断
if(this.platform.is('cordova'))
3.刚开始写这个demo的时候,没有注意到ionic的版本的问题,在声明插件的时候总是报这个错误
'AppVersion' refers to a value, but is being used as a type here.
于是,整整两天陷入了如下的死循环当中
1.只能这样导入 :
import { AppVersion } from '@ionic-native/app-version/ngx';
如果这样导入:
import { AppVersion } from '@ionic-native/app-version' ,
还是会出现上面的错误。
2.所以我
import { AppVersion } from '@ionic-native/app-version/ngx' ;
这样导入的,可以正常编译了,但是调用this.appVersion.getVersionNumber();的时候,又开始报错了:
TypeError: Object(...) is not a function,
at AppVersion.getVersionNumber ()……
现在可以稍微解释一下上面的问题:在ionic3的node_modules里面,@ionic-native/app-version@4这个目录下面没有ngx这个下级目录,但是在在ionic3的node_modules里面,@ionic-native/app-version 是有下级目录ngx的;
在具体应用的时候,导入插件时大括号里面声明的应该写成什么样子,也需要到目录里面查看导出的变量是什么
ionic3参考地址
https://ionicframework.com/docs/v3/native/app-version/
ionic4参考地址
https://ionicframework.com/docs/native/app-version
感谢:No刹那光辉