1
I’m trying to add video in the app by following this tutorial : https://www.youtube.com/watch?v=E4S1yVBUPpk&t=9s
I did everything right I believe, but when I run the application with Ionic serves -c , and open in Ionic Devapp I get the message by clicking the Playvideo button:
console.warn: Native: tried Calling Videoplayer.play, but the Videoplayer plugin is not installed.
[15:49:16] console.warn: Install the Videoplayer plugin: 'Ionic Cordova plugin add https://github.com/moust/cordova-plugin-videoplayer.git'.
But I have the plugin installed, already removed and installed, I came to create other projects but always at the end returns this error as if I had not installed the plugin. It still appears in "plugins". Does anyone know what this might be? Could it be from Ionic Devapp? I don’t have an emulator to test, just devapp.
And I didn’t find many tutorials on how to video in the app. I will actually add an image, and click on it to play the video, a real "advertisement". But at first I’m trying to add the video. If anyone can help me, I’ll be very grateful. Thank you!
My Home.Ts code is :
import { Component } from '@angular/core';
import { NavController } from 'ionic-angular';
import { VideoPlayer, VideoOptions } from '@ionic-native/video-player';
@Component({
selector: 'page-home',
templateUrl: 'home.html'
})
export class HomePage {
videoOptions: VideoOptions;
videoUrl: string;
constructor(private videoPlayer: VideoPlayer, public navCtrl: NavController) {
}
async playVideo() {
try {
this.videoOptions = {
volume: 0.7
}
this.videoUrl = "http://techslides.com/demos/sample-videos/small.mp4"
this.videoPlayer.play(this.videoUrl, this.videoOptions)
}
catch (e) {
console.error(e);
}
}
}
Spun the
ionic cordova plugin add cordova-plugin-video-player
and thenpm install @ionic-native/video-player --save
and restarted theserve
after that? Ran the commands in the project folder?– Guilherme Nascimento
When you say reset the serve, what does it mean? but I ran Ionic Cordova plugin add Cordova-plugin-video-player (videoplayer without " - " ) and npm install @Ionic-Native/video-player --save within the project, both were installed.
– Felipe XST
You are developing via command
ionic serve
or directly in the emulator/phone? If it’s in the emulator/phone then ignore the restart part.– Guilherme Nascimento
I am using Ionic serves, but in Chrome when I click on Play Video, gives the message that Cordova is not available in the browser. However I opened by the application Ionic devapp. and in it when I click on play video, I get the message q the plugin n has been installed
– Felipe XST
Oh yes it’s true, Cordova plugins only run by emulator, so does the following run command
ionic doctor list
, This will list possible problems.– Guilherme Nascimento
typed and received this: Automatic-updates-off ------ npm-installed-locally ----- Ionic-installed-locally ------- git-not-used ---- git-config-invalid -------- Ionic-angular-update-available- ---- Ionic-angular-major-update-available-- app-scripts-update-available ---- app-scripts-major-update-available ---- Ionic-Native-old-version-installed ------ Ionic-Native-update-available ----- Ionic-Native-major-update-available ----- Unsaved-Cordova-Platforms --- Cordova-Platforms-Committed --- default-Cordova-Bundle-id-used ---- viewport-fit-not-set. ----
– Felipe XST
Boy, you’re in a lot of trouble :/
– Guilherme Nascimento
Back up your project to a ZIP or RAR, then run the command
ionic doctor check
– Guilherme Nascimento
So all this is trouble? I’m still learning about it.. But are all the things that are there when I use the "Ionic doctor list" trouble? would like to know. I will use Ionic doctor check command
– Felipe XST
Yes and no, there are outdated things, old things that still work but can be replaced, and things that should already have been removed/updated. Of course it is not worth updating always, has old that works well, sometimes works better than new because of other dependencies (not that it is better in fact)
– Guilherme Nascimento
Thank you for replying to me @Guilhermenascimento. I received this after the command:
– Felipe XST
Play Store, the Bundle ID can’t be changed. This Issue was Detected because this app’s Bundle ID is "io.ionic.Starter", which is the default Bundle ID provided after running Ionic start. To fix, take the following step(s): 1) Change the id attribute of <widget> (root element) to Something other than "io.ionic.Starter" Ignore this Issue with: Ionic doctor ignore-default Cordova-Bundle-id-used
– Felipe XST
Vixe, is full of problem :/ including configuration of your APP. It has to create a separate project from scratch?
– Guilherme Nascimento
Sure. I’ll try again when I get home on another computer. Maybe the result is different, but I put the result here. and thank you again for answering me.
– Felipe XST
I think your NPM and your global plugins may be outdated in general :/ , it could be several problems, I had the same problem (not the same exactly), then I removed everything and installed again, I just backed up the projects, but I removed the project folder that contained the packages and reviewed package.json. Of course in my case I had to remove up to Packages.json and start a project from scratch, just copying the src and app folder (and Assets), now here is running nice
– Guilherme Nascimento