[英]IONIC 4+ Capacitor: How to install a cordova plugin (Stepcounter) from github without ionic native?
I want to add a Cordova plugin which is available on GitHub to my IONIC 5+ Capacitor (Angular) project.我想将 GitHub 上可用的Cordova插件添加到我的 IONIC 5+ 电容器(角)项目中。
Also, I don't know how to install and integrate this plugin, because the official manual says that after the step npm install https://github.com/DigitalsunrayMedia/cordova-plugin-stepcounter
also npm install ionic-native/???????
另外,我不知道如何安装和集成这个插件,因为官方手册说在步骤
npm install https://github.com/DigitalsunrayMedia/cordova-plugin-stepcounter
之后还有npm install ionic-native/???????
My problem is right here!我的问题就在这里! What should I do with
npm install ionic-native/????????
npm install ionic-native/????????
enter?进入? The desired plugin does not exist as an Ionic Native plugin.
所需的插件不作为 Ionic Native 插件存在。
Is it sufficient, if I simply execute the following:如果我只是执行以下操作就足够了:
npm install https://github.com/DigitalsunrayMedia/cordova-plugin-stepcounter.git
npx cap sync
npm install https://github.com/DigitalsunrayMedia/cordova-plugin-stepcounter.git
npx cap sync
without the step of npm install ionic-native/????
没有
npm install ionic-native/????
I would also like to know if I can easily add and use it in Ionic Capacitor or if I have to make changes in a file.我还想知道我是否可以在 Ionic Capacitor 中轻松添加和使用它,或者我是否必须在文件中进行更改。
How do I address this plugin in Typescript?如何解决 Typescript 中的这个插件? Do I have to add anything to module.app?
我必须向 module.app 添加任何内容吗?
Is it sufficient if I do it the way Capacitor prescribes: import { Plugins } from '@capacitor/core';
如果我按照 Capacitor 规定的方式进行操作是否足够:
import { Plugins } from '@capacitor/core';
const { Stepcounter } = Plugins;
I am very grateful for any advice: Thank youu,) Best regards, programmerg我非常感谢任何建议:谢谢,)最好的问候,程序员
Yes you can install plugin and use it without ionic-native, basically ionic-native is just typed wrapper of library.是的,您可以安装插件并在没有 ionic-native 的情况下使用它,基本上 ionic-native 只是库的类型化包装器。
The easiest way would be to implement service最简单的方法是实现服务
import { Injectable } from '@angular/core';
declare var stepcounter: any;
@Injectable({
providedIn: 'root'
})
export class StepCounterService {
constructor() {}
start(startingOffset) {
return new Promise((resolve, reject) => {
stepcounter.start(
startingOffset,
message => {
resolve(message);
},
() => {
reject();
}
);
});
}
stop() {
return new Promise((resolve, reject) => {
stepcounter.stop(
message => {
resolve(message);
},
() => {
reject();
}
);
});
}
getTodayStepCount() {
return new Promise((resolve, reject) => {
stepcounter.getTodayStepCount(
message => {
resolve(message);
},
() => {
reject();
}
);
});
}
getStepCount() {
return new Promise((resolve, reject) => {
stepcounter.getStepCount(
message => {
resolve(message);
},
() => {
reject();
}
);
});
}
deviceCanCountSteps() {
return new Promise((resolve, reject) => {
stepcounter.deviceCanCountSteps(
message => {
resolve(message);
},
() => {
reject();
}
);
});
}
getHistory() {
return new Promise((resolve, reject) => {
stepcounter.getHistory(
message => {
resolve(message);
},
() => {
reject();
}
);
});
}
}
Now you inject it where you need so you can use it现在你把它注入你需要的地方,这样你就可以使用它了
PS. PS。 I assume you are using angular and typescript if you are using vanilla ionic and javascript you can install plugin and use it
我假设您使用的是 angular 和 typescript 如果您使用的是香草离子和 javascript 您可以安装插件并使用它
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.