When I add the camera plugin and run my app i recieve the following error:
ERROR Error: Uncaught (in promise): TypeError: Object(...) is not a
function TypeError: Object(...) is not a function
at Camera.getPicture
app.module.ts add those
import { Camera, CameraOptions } from '#ionic-native/camera'; **Ionic 3**
import { Camera, CameraOptions } from '#ionic-native/camera/ngx'; **Ionic 4**
providers: [
Camera
]
Related
When I try to run my flutter app on chrome, it crashes. It happens only after I installed Firebase_core and runs fine on Android or iOS. I am trying to connect my flutter web app, to the same Firebase Cloud, as my other app. I have follewed the instructions in the firebase console and added a new app. I tried adding a new web app, following the steps, and when that didn't work, I tried the same with adding a flutter app. (Here I talking about the firebase console).
I tried to initialize the app in my main file like this:
import "package:firebase_core/firebase_core.dart" as core;
void main() async {
WidgetsFlutterBinding.ensureInitialized();
await core.Firebase.initializeApp(
options: core.FirebaseOptions(
apiKey: "apiKey",
appId: "appId",
messagingSenderId: "messagingSenderId",
projectId: " projectId"
)
);
runApp(const MyApp());
}
And in my html I added this script to the body:
<script type="module">
// Import the functions you need from the SDKs you need
import { initializeApp } from "firebase/app";
import { getAnalytics } from "firebase/analytics";
// TODO: Add SDKs for Firebase products that you want to use
// https://firebase.google.com/docs/web/setup#available-libraries
// Your web app's Firebase configuration
// For Firebase JS SDK v7.20.0 and later, measurementId is optional
const firebaseConfig = {
apiKey: "my apikey",
authDomain: "my authDomain",
databaseURL: "databaseURL",
projectId: "projectId",
storageBucket: "storageBucket",
messagingSenderId: "messagingSenderId",
appId: "appId",
measurementId: "measurementId"
};
// Initialize Firebase
const app = initializeApp(firebaseConfig);
const analytics = getAnalytics(app);
</script>
My pubspec.yaml is very simple:
dependencies:
flutter:
sdk: flutter
# The following adds the Cupertino Icons font to your application.
# Use with the CupertinoIcons class for iOS style icons.
cupertino_icons: ^1.0.2
firebase_core: ^2.1.1
The error I am getting:
../../../flutter/.pub-cache/hosted/pub.dartlang.org/firebase_core_web-2.0.1/lib/firebase_core_web.dart:46:15: Error: Method not found:
'getProperty'.
if (js_util.getProperty(e, 'name') == 'FirebaseError') {
^^^^^^^^^^^
../../../flutter/.pub-cache/hosted/pub.dartlang.org/firebase_core_web-2.0.1/lib/firebase_core_web.dart:47:20: Error: Method not found:
'getProperty'.
return js_util.getProperty(e, 'code') ?? '';
^^^^^^^^^^^
../../../flutter/.pub-cache/hosted/pub.dartlang.org/firebase_core_web-2.0.1/lib/firebase_core_web.dart:59:15: Error: Method not found:
'getProperty'.
if (js_util.getProperty(e, 'name') == 'FirebaseError') {
^^^^^^^^^^^
../../../flutter/.pub-cache/hosted/pub.dartlang.org/firebase_core_web-2.0.1/lib/firebase_core_web.dart:60:30: Error: Method not found:
'getProperty'.
String rawCode = js_util.getProperty(e, 'code');
^^^^^^^^^^^
../../../flutter/.pub-cache/hosted/pub.dartlang.org/firebase_core_web-2.0.1/lib/firebase_core_web.dart:62:30: Error: Method not found:
'getProperty'.
String message = js_util.getProperty(e, 'message') ?? '';
^^^^^^^^^^^
../../../flutter/packages/flutter_web_plugins/lib/src/navigation/js_url_strategy.dart:48:14: Error: Method not found: 'allowInterop'.
getPath: allowInterop(strategy.getPath),
^^^^^^^^^^^^
../../../flutter/packages/flutter_web_plugins/lib/src/navigation/js_url_strategy.dart:49:15: Error: Method not found: 'allowInterop'.
getState: allowInterop(strategy.getState),
^^^^^^^^^^^^
../../../flutter/packages/flutter_web_plugins/lib/src/navigation/js_url_strategy.dart:50:26: Error: Method not found: 'allowInterop'.
addPopStateListener: allowInterop(strategy.addPopStateListener),
^^^^^^^^^^^^
../../../flutter/packages/flutter_web_plugins/lib/src/navigation/js_url_strategy.dart:51:25: Error: Method not found: 'allowInterop'.
prepareExternalUrl: allowInterop(strategy.prepareExternalUrl),
^^^^^^^^^^^^
../../../flutter/packages/flutter_web_plugins/lib/src/navigation/js_url_strategy.dart:52:16: Error: Method not found: 'allowInterop'.
pushState: allowInterop(strategy.pushState),
^^^^^^^^^^^^
../../../flutter/packages/flutter_web_plugins/lib/src/navigation/js_url_strategy.dart:53:19: Error: Method not found: 'allowInterop'.
replaceState: allowInterop(strategy.replaceState),
^^^^^^^^^^^^
../../../flutter/packages/flutter_web_plugins/lib/src/navigation/js_url_strategy.dart:54:9: Error: Method not found: 'allowInterop'.
go: allowInterop(strategy.go),
^^^^^^^^^^^^
../../../flutter/.pub-cache/hosted/pub.dartlang.org/firebase_core_web-2.0.1/lib/src/interop/utils/js_interop.dart:25:12: Error: Method not
found: 'hasProperty'.
if (util.hasProperty(jsObject, 'toDateString')) {
^^^^^^^^^^^
../../../flutter/.pub-cache/hosted/pub.dartlang.org/firebase_core_web-2.0.1/lib/src/interop/utils/utils.dart:45:31: Error: Method not found:
'getProperty'.
map[key] = dartify(util.getProperty(jsObject, key), customDartify);
^^^^^^^^^^^
../../../flutter/.pub-cache/hosted/pub.dartlang.org/firebase_core_web-2.0.1/lib/src/interop/utils/utils.dart:81:22: Error: Method not found:
'newObject'.
var jsMap = util.newObject();
^^^^^^^^^
../../../flutter/.pub-cache/hosted/pub.dartlang.org/firebase_core_web-2.0.1/lib/src/interop/utils/utils.dart:83:12: Error: Method not found:
'setProperty'.
util.setProperty(jsMap, key, jsify(value, customJsify));
^^^^^^^^^^^
../../../flutter/.pub-cache/hosted/pub.dartlang.org/firebase_core_web-2.0.1/lib/src/interop/utils/utils.dart:89:12: Error: Method not found:
'allowInterop'.
return allowInterop(dartObject);
^^^^^^^^^^^^
../../../flutter/.pub-cache/hosted/pub.dartlang.org/firebase_core_web-2.0.1/lib/src/interop/utils/utils.dart:103:10: Error: Method not found:
'callMethod'.
util.callMethod(jsObject, method, args);
^^^^^^^^^^
../../../flutter/.pub-cache/hosted/pub.dartlang.org/firebase_core_web-2.0.1/lib/src/interop/utils/utils.dart:116:15: Error: Method not found:
'promiseToFuture'.
return util.promiseToFuture(thenable);
^^^^^^^^^^^^^^^
../../../flutter/.pub-cache/hosted/pub.dartlang.org/firebase_core_web-2.0.1/lib/src/interop/utils/utils.dart:124:27: Error: Method not found:
'allowInterop'.
return PromiseJsImpl<S>(allowInterop((
I have tried to find and follow various tutorial on how to add firebase to a Flutter web app. Non of them helped me, since the problem seems to come from the firebase_core package. I have tried to add the firebase_core_web package. I also downgraded various firebase packages and tried with diffrent combinations based on what recommendations I could find online. I always got the same error.
I have upgraded flutter to the newest version.
The error can be simply recreated by creating af new flutter project, and install firebase_core. If you then run the app on chrome, the error will show up in the terminal. At least, that is what happens to me ...
!!! SOLVED !!!
I solved the problem with simply repairing the pub-cache folder using the " flutter pub cache repair " command. Hallelujah !
I'm Learning Ionic v4 and the template are compiled successfully. But when I change these template to components examples like this one below, It gives error that I mention below.
What did i do wrong? And if the process I made for testing alert is wrong, how can I test codes and add pages in ionic?
I would be grateful if anyone can help me learn to use ionic. I have project to deliver in 2 weeks
Thanks
import { Component } from '#angular/core';
import { AlertController } from 'ionic-angular';
#Component({
templateUrl: 'template.html'
})
export class BasicPage {
constructor(public alerCtrl: AlertController) { }
doAlert() {
let alert = this.alerCtrl.create({
title: 'New Friend!',
message: 'Your friend, Obi wan Kenobi, just approved your
friend request!',
buttons: ['Ok']
});
alert.present()
}
}
ERROR in
./src/app/tab3/tab3.module.ts 16:58-
66
[ng] "export 'Tab3Page' was not
found in './tab3.page'
[ng] ERROR in
./src/app/tab3/tab3.module.ts 18:23-
31
[ng] "export 'Tab3Page' was not
found in './tab3.page'
[ng] ERROR in
./src/app/tab3/tab3.page.ts
[ng] Module not found:
./src/app/tab3/tab3.page.ts
[ng] Module not found: Error: Can't
resolve 'ionic-angular' in
'C:\Users\ASUS\Ionic\
app\src\app\tab3'
[ng] Time: 797ms
[ng] i ｢wdm｣: Failed to compile.
[ng]
[ng] ERROR in
src/app/tab3/tab3.module.ts(6,10):
error TS2305: Module
'"C:/Users/ASUS/Ionic/app
/src/app/tab3/tab3.page"' has no
exported member 'Tab3Page'.
[ng]
src/app/tab3/tab3.page.ts(3,33):
error TS2307: Cannot find module
'ionic-angular'**
There are various update in Ionic4.
import { AlertController } from '#ionic/angular'; // Ionic 4
import { AlertController } from 'ionic/angular'; // Ionic 3
you can add page using command line it will wire all things
https://ionicframework.com/docs/cli/commands/generate
ionic generate page your_page_name
Looks like your tab3 component(tab3.page.ts) is ok but there is problems with your tab3 module(tab3.module.ts same folder). Best way to get rid of this error is deleting tab3 page and recreating page with below command.
ionic generate page tab3
update this.
import { AlertController } from 'ionic-angular';
it will be
import { AlertController } from '#ionic/angular';
In ionic4, its changed that's why you are getting an error.
visit this link
I was using traceur and es6 loader, but I change to systemjs and when I try to use System.paths['jquery'], I had the message:
Error: Cannot set SystemJS.paths["jquery"] directly. Use SystemJS.config({ paths: { "jquery": ... } }) rather
So I change to:
System.config({
paths: {
"jquery": "./node_modules/jquery/dist/jquery.js"
}
});
System.import('jquery');
System.import('src/app.js');
Show this error:
system.js:4 Uncaught (in promise) Error: Fetch error: 404 Not Found
system.js:4 Uncaught (in promise) Error: Unable to dynamically transpile ES module
A loader plugin needs to be configured via `SystemJS.config({ transpiler: 'transpiler-module' })`.
I tried, but didn't work:
System.config({
transpiler: "babel",
map: {
"babel": "./node_modules/babel-core/lib/api/browser.js",
"jquery": "./node_modules/jquery/dist/jquery.js"
}
})
Error
system.js:4 Uncaught (in promise) Error: Fetch error: 404 Not Found
Instantiating localhost:3000/node_modules/babel-core/lib/api/node
Loading localhost:3000/node_modules/babel-core/lib/api/browser.js
Loading babel
Unable to load transpiler to transpile localhost:3000/src/app.js
I think you need to inform systemjs that jquery should be added as a global script so it doesn't try to transpile it. Try the following:
System.config({
paths: {
"jquery": "./node_modules/jquery/dist/jquery.js"
},
meta: {
"jquery": { "format": "global" }
}
});
I am using zingchart in my angular2 application and came a cross this problem.
when I am trying to click the node - I get:
angular2.dev.js:23730 EXCEPTION: Error: Uncaught (in promise): TypeError: Cannot read property 'parentNode' of null
when I try to do that same when I am in debug mode - i.e. do it slower when jumping from line to line everything works fine.
I read a lot about about the Uncaught (in promise): TypeError: here and tried some solutions but with no luck.
Maybe anyone have an idea for me?
Thanks
I have a pie chart:
Which have the following code:
render(){
this.zone.runOutsideAngular(() => {
zingchart.render({
id : this.chart['id'],
data : this.chart['data'],
width : this.chart['width'],
height: this.chart['height']
});
zingchart.node_click = function(p) {
window.location.href = #/resources";
}
});}
my resource component is very simple:
import { Component } from 'angular2/core';
#Component({
selector: 'resources-component',
templateUrl: `I am the resource page`,
})
export class ResourcesComponent {
title: string = 'resources';
constructor() {
}
}
i got a Problem. I want a global Service. I found this: Link.
It works but i want after initialized my component
an event what is called after my component is bootstrapped.
Anyone know this event?
Lyror
Update
yes i want to do that:
import {GlobalService} from './GlobalService';
import {Component, provide, Injector, ComponentRef} from 'angular2/core';
import {bootstrap} from 'angular2/platform/browser';
import {HTTP_PROVIDERS} from 'angular2/http';
import {appInjector} from './app.injector';
import {RouteConfig, ROUTER_DIRECTIVES, ROUTER_PROVIDERS,
LocationStrategy, HashLocationStrategy} from 'angular2/router';
import {AppComponent} from './app.component';
bootstrap(AppComponent, [
ROUTER_PROVIDERS,
provide(LocationStrategy, { useClass: HashLocationStrategy }),
HTTP_PROVIDERS,
GlobalService
]).then((appRef: ComponentRef) => {
var injector = appInjector(appRef.injector);
var appComp: AppComponent = injector.get(AppComponent);
appComp.init();
});
But i get two Errors:
Unhandled Promise rejection: appComp.init is not a function ; Zone: ; Task: Promise.then ; Value: TypeError: appComp.init is not a function
Error: Uncaught (in promise): TypeError: appComp.init is not a function
The bootstrap function return a promise. The provided callback at this level is called when the component is bootstrapped:
bootstrap(AppComponent).then((compRef:ComponentRef) => {
// Do something after the component is bootstrapped
var comp = compRef.instance;
comp.init();
});