PROBLEM: no modals are showing and no DOM update is automatically triggered (I need to call changeDetectorRef.detectChanges() ), when I import and use SoundCloud API with typings in my Ionic2 project.
How I am importing SoundCloud API to my Ionic2 project:
In command prompt:
npm install soundcloud
typings install soundcloud --save
In my TS:
import * as SC from 'soundcloud';
or
import SC = require('soundcloud');
The soundcloud api itself works perfectly (audio streaming, tracks listing). But, no modal will show up in my ionic2 project while this code is inserted in any ts file of my project. Also, no DOM update is automatically triggered.
My ionic info:
Cordova CLI: 6.3.0
Gulp version: CLI version 3.9.1
Gulp local: Local version 3.9.1
Ionic Framework Version: 2.0.0-beta.10
Ionic CLI Version: 2.0.0-beta.32
Ionic App Lib Version: 2.0.0-beta.18
OS:
Node Version: v6.2.2
NOTE:
If I remove soundcloud code, modals will show up again. Also, DOM updates will get triggered again.
No errors/warnings are shown in console.
Any ideas?
Related
I want show custom splash screen with animation. I tried add LottieSplashScreen plugin but i can't do this.
Tried with this code
cordova plugin add cordova-plugin-lottie-splashscreen
But i facing
'sh' is not recognized as an internal or external command,
operable program or batch file.
Failed to install 'cordova-plugin-lottie-splashscreen': Error: Hook failed with error code ENOENT: C:\Users\bbara\Desktop\GuvercinSepetim\plugins\cordova-plugin-lottie-splashscreen\hooks\ios\update_pod_repo.sh
at C:\Users\bbara\AppData\Roaming\npm\node_modules\cordova\node_modules\cordova-lib\src\hooks\HooksRunner.js:224:23
at _rejected (C:\Users\bbara\AppData\Roaming\npm\node_modules\cordova\node_modules\q\q.js:864:24)
at C:\Users\bbara\AppData\Roaming\npm\node_modules\cordova\node_modules\q\q.js:890:30
at Promise.when (C:\Users\bbara\AppData\Roaming\npm\node_modules\cordova\node_modules\q\q.js:1142:31)
at Promise.promise.promiseDispatch (C:\Users\bbara\AppData\Roaming\npm\node_modules\cordova\node_modules\q\q.js:808:41)
at C:\Users\bbara\AppData\Roaming\npm\node_modules\cordova\node_modules\q\q.js:624:44
at runSingle (C:\Users\bbara\AppData\Roaming\npm\node_modules\cordova\node_modules\q\q.js:137:13)
at flush (C:\Users\bbara\AppData\Roaming\npm\node_modules\cordova\node_modules\q\q.js:125:13)
at processTicksAndRejections (internal/process/next_tick.js:74:9)
Hook failed with error code ENOENT: C:\Users\bbara\Desktop\GuvercinSepetim\plugins\cordova-plugin-lottie-splashscreen\hooks\ios\update_pod_repo.sh
You are running a cordova node but not ionic cordova:
cordova plugin add cordova-plugin-lottie-splashscreen
According to ionic documentation:
npm install #ionic-native/lottie-splash-screen
ionic cordova plugin add cordova-plugin-lottie-splashscreen
And here is the referance:
https://ionicframework.com/docs/native/lottie-splash-screen
And here is the github reposatory of the plugin :
https://github.com/timbru31/cordova-plugin-lottie-splashscreen
Try looking into Capacitor instead of Cordova. You can still use all your Cordova libraries, but the Capacitor build is a bit cleaner. I followed this tutorial and found it very useful with good tools. It worked for me first time, which is never the case with some Ionic stuff!
https://enappd.com/blog/icon-splash-in-ionic-react-capacitor-apps/114/
The issue you are describing was fixed in the v0.8.1 release. It originated from preparing/building the iOS platform on a Windows machine - which won't work anyways. Because cordova-ios supports recent Pod installations out of the box, it's no longer required to sync the repo, i.e, the hook is obsolete. However, the lottie plugin won't fail anymore.
Side note: I'm the author of this plugin.
Live Reload has stopped working.
When I save code changes, the browser automatically refreshes, but code changes are not reflected. I need to stop my CLI and run ionic serve again in order to have any code changes reflected in the browser.
Your system information:
Cordova CLI: 6.4.0
Ionic Framework Version: 2.3.0
Ionic CLI Version: 2.1.18
Ionic App Lib Version: 2.1.9
Ionic App Scripts Version: 1.1.4
ios-deploy version: Not installed
ios-sim version: Not installed
OS: macOS Sierra
Node Version: v6.9.4
Xcode version: Xcode 8.2.1 Build version 8C1002
I think your problem is with your current project.So please create a new project like below.
ionic start myfirstapp blank --v2
After that see whether live reload is working or not.It should work now.
ionic serve
Note: If above one is working then you can copy/ paste your previous project's custom items where you have created to this project.Hope that solution will be much quicker than try to find a solution with the old project.That is my idea.
I did these to resolve this error on my ubuntu
Remove the npm_folder and package-lock.json files
Run npm install --save-dev
Restart your system
I'm developing an Ionic2 application and now I want to make a build but I get an error.
ionic info returns this:
Cordova CLI: 6.3.1
Ionic Framework Version: 2.0.0-rc.1
Ionic CLI Version: 2.1.1
Ionic App Lib Version: 2.1.1
Ionic App Scripts Version: 0.0.36
OS: Distributor ID: Ubuntu Description: Ubuntu 16.04.1 LTS
Node Version: v4.2.6
my main.prod.ts looks like this:
import { platformBrowser } from '#angular/platform-browser';
import { enableProdMode } from '#angular/core';
import { AppModuleNgFactory } from './app.module.ngfactory';
enableProdMode();
platformBrowser().bootstrapModuleFactory(AppModuleNgFactory);
Everytime I try to do ionic build android I get this:
bundle failed: Could not resolve './app.module.ngfactory' from /home/xxx/Desktop/myApp/.tmp/app/main.prod.ts
ionic-app-script task: "build"
Ionic2 uses the Ahead-Of-Time-Compilation of Angular2 (by using ngc). What ngc does, is creating a factory out of your normal app-module and renames this module by adding NgFactory to the modules' Name.
So for example if you have an app-module called MySuperAwesomeApp, ngc creates a file which exports a factory called MySuperAwesomeAppNgFactory. And when building your Android app, ionic will search for MySuperAwesomeAppNgFactory instead of MySuperAwesomeApp, thus throwing an error, when not finding it.
In your case I suppose that you renamed your app-module (located in ./app.module.ts) but didn't change the factory name in the main.prod.ts.
For further reading on AOT, please refer to the Angular2 AOT Doc.
When I run ionic link command inside ionic project folder I got following error message
"You cannot run this command unless you are in an Ionic Project folder"
My system info.
Cordova CLI: 6.3.1
Gulp version: CLI version 1.2.1
Gulp local: Local version 3.9.1
Ionic Framework Version: 2.0.0-beta.11
Ionic CLI Version: 2.0.0-beta.36
Ionic App Lib Version: 2.0.0-beta.19
OS: Distributor ID: Ubuntu Description: Ubuntu 14.04.4 LTS
Node Version: v6.4.0
You can use following command to setup app linking with Ionic IO.
ionic io init
this will update ionic.config.json with app_id and generate .io-config.json file with app_id and api_key.
ionic io init
is no longer available in cli 3. Create a new app from apps.ionic.io dashboard and then run
ionic link
which will list down apps from your ionic.io account and let you choose an app to which you want to link your local app. You have to run 'ionic login' if you haven't done so already.
I'm starting to learn Ionic2, I have created a new project with ionic start myproject --v2 and everything works correctly if I do ionic serve.
The build folder is missing in ionic 2 project folder.
Whenever I am trying to download any existing Ionic2 template in that one also build folder missing.
ionic -v 2.0.0-beta.30
cordova -v 6.2.0
node -v v6.2.1
npm -v 3.9.5
your ionic serve build is under www. The native builds ( from ionic build) are under platform.
A little late but I had the same issue and was able to fix it by installing Gulp :
npm install -g gulp
Then I did gulp build.
This solved my issues and generated the build folder as it was supposed to.
First you need to add support for the platform/s you are working with, by executing from Ionic CLI console:
ionic platform add android
or
ionic platform add ios
And then you should build your project by executing:
ionic build android
or
ionic build ios