Getting the following error while creating the build.Else not having any problem.
Any solutions to resolve this issue.
Currently using following congfiguration...'
"#angular/animations": "5.2.11",
"#angular/common": "5.2.11",
"#angular/compiler": "5.2.11",
"#angular/compiler-cli": "5.2.11",
"#angular/core": "5.2.11",
"#angular/fire": "^5.2.3",
"#angular/forms": "5.2.11",
"#angular/http": "5.2.11",
"#angular/platform-browser": "5.2.11",
"#angular/platform-browser-dynamic": "5.2.11",
"#ionic-native/core": "~4.20.0",
"#ionic-native/in-app-browser": "^4.20.0",
"#ionic-native/splash-screen": "~4.20.0",
"#ionic-native/status-bar": "~4.20.0",
"#ionic/storage": "2.2.0",
"#ngx-translate/core": "^9.1.1",
"#ngx-translate/http-loader": "^2.0.1",
"angular-bottom-sheet": "^1.2.5",
"angular-material": "^1.1.20",
"angular2": "^2.0.0-beta.21",
"angularfire2": "^5.0.0-rc.6",
"call-number": "^1.0.1",
"cordova-android": "^7.0.0",
"cordova-plugin-device": "^2.0.2",
"cordova-plugin-inappbrowser": "^3.1.0",
"cordova-plugin-ionic-keyboard": "^2.2.0",
"cordova-plugin-ionic-webview": "^4.1.3",
"cordova-plugin-splashscreen": "^5.0.2",
"cordova-plugin-statusbar": "^2.4.2",
"cordova-plugin-whitelist": "^1.3.3",
"firebase": "^7.6.1",
"ionic-angular": "3.9.5",
"ionicons": "3.0.0",
"promise-polyfill": "^8.1.3",
"rxjs": "^6.0.0",
"rxjs-compat": "^6.5.3",
"sw-toolbox": "3.6.0",
"zone.js": "0.8.29"
},
"devDependencies": {
"#ionic/app-scripts": "3.2.2",
"typescript": "3.2.2"
},
I got an error blow, please find it:
[20:15:04] typescript: ...e_m_pwd_app/e_i/node_modules/#firebase/database/dist/src/api/Database.d.ts, line: 44
An accessor cannot be declared in an ambient context.
L43: * We throw a exception if the url is not in the same domain as the
L44: * current repo.
L45: * #param {string} url
[20:15:04] typescript: ...m_pwd_app/e_i/node_modules/#firebase/database/dist/src/api/DataSnapshot.d.ts, line: 88
An accessor cannot be declared in an ambient context.
[20:15:04] typescript: ...m_pwd_app/e_i/node_modules/#firebase/database/dist/src/api/DataSnapshot.d.ts, line: 98
An accessor cannot be declared in an ambient context.
[20:15:04] typescript: ...nd/e_p/e_i/node_modules/#firebase/database/dist/src/api/Query.d.ts, line: 36
An accessor cannot be declared in an ambient context.
L36: * Validates that no other order by call has been made
L37: * #param {!string} fnName
[20:15:04] typescript: ...nd/e_p/e_i/node_modules/#firebase/database/dist/src/api/Query.d.ts, line: 37
An accessor cannot be declared in an ambient context.
L36: * Validates that no other order by call has been made
L37: * #param {!string} fnName
L38: * #private
i am working with firebase database with ionic framework. when i trying to connect with firebase i am getting above mentioned error in ionic framework,
please give me a solution for this issue.
please check the keyname firebase as well as your code (fnName). please share your code
Related
I'm getting this issue after build successfully and run on browser with angular universal
Here is my package json :
{
"name": "ssr",
"version": "1.0.0",
"private": true,
"dependencies": {
"#angular/animations": "10.0.5",
"#angular/cdk": "10.1.0",
"#angular/common": "10.0.5",
"#angular/compiler": "10.0.5",
"#angular/core": "10.0.5",
"#angular/fire": "^6.0.2",
"#angular/forms": "10.0.5",
"#angular/http": "^7.2.16",
"#angular/localize": "^10.0.5",
"#angular/material": "10.1.0",
"#angular/material-moment-adapter": "10.1.0",
"#angular/platform-browser": "10.0.5",
"#angular/platform-browser-dynamic": "10.0.5",
"#angular/platform-server": "^10.0.5",
"#angular/router": "10.0.5",
"#ng-bootstrap/ng-bootstrap": "^7.0.0",
"#ng-toolkit/universal": "^8.1.0",
"#nguniversal/express-engine": "^10.0.1",
"#types/jquery": "^3.5.1",
"#types/node": "^8.10.62",
"angular-in-memory-web-api": "^0.11.0",
"angular-ng-autocomplete": "^2.0.1",
"classlist.js": "^1.1.20150312",
"codelyzer": "^6.0.0",
"core-js": "2.6.9",
"crypto-js": "^3.3.0",
"express": "^4.15.2",
"firebase": "^7.17.1",
"hammerjs": "^2.0.8",
"jquery": "^3.5.1",
"localstorage-polyfill": "^1.0.1",
"moment": "2.24.0",
"ng2-slim-loading-bar": "^4.0.0",
"ng5-slider": "^1.1.14",
"ngx-order-pipe": "^2.0.4",
"ngx-pagination": "^3.2.1",
"ngx-spinner": "^10.0.1",
"rxjs": "^6.6.0",
"rxjs-compat": "^6.6.0",
"sweetalert2": "^8.19.0",
"tslib": "^1.13.0",
"web-animations-js": "^2.3.2",
"whatwg-fetch": "^3.2.0",
"zone.js": "0.10.3"
},
I just updated my project to Angular 10 and started facing this issue.
What i did was , wherever I had BehaviorSubject imports ,
i changed them from import { BehaviorSubject } from "rxjs/Rx"; to import { BehaviorSubject } from "rxjs";
This makes production build work without any error.
I got solution, use rxjs-tslint and migrate all rxjs syntax : https://www.npmjs.com/package/rxjs-tslint
I am able to solve this by using the build command as ng build --configuration=prod --aot= false --build-optimizer=false. Application is up and running for us now. But it's a work around only. We are trying to check few more ways without setting optimiser to false.Will update you.
I guess your question is solved,
I fixed it using ng build instead of ng build --prod. I am now investigating why the --prod command line compile my app differently
I guess your question is solved,
I fixed it using ng build instead of ng build --prod. I am now investigating why the --prod command line compile my app differently
I'm using moment.js with moment timezone in it.
I was trying to find how to get code 'fr' from zone name 'Europe/Paris' all day, but with no luck.
I read all their docs and couldn't find that function either, so i need help on this one.
Closest what i found is this. I need this function but in reverse, to pass country name and get country code.
Luckily i found solution
moment.tz.zone('America/New_York').countries()
This will get you array so you guys can easily pass that value to locale()
So final code would be:
var get_locale = moment.tz.zone('America/New_York').countries();
moment.locale(get_locale);
I was trying to below code in my Angular(v12.0.5) project and get this error.
var get_locale = moment.tz.zone('America/New_York').countries();
moment.locale(get_locale);
Error -
package.json -
"dependencies": {
"#angular/animations": "^12.0.5",
"#angular/cdk": "~12.2.13",
"#angular/common": "~12.0.3",
"#angular/compiler": "~12.0.3",
"#angular/core": "~12.0.3",
"#angular/forms": "~12.0.3",
"#angular/material": "~12.2.13",
"#angular/material-moment-adapter": "^13.2.2",
"#angular/platform-browser": "~12.0.3",
"#angular/platform-browser-dynamic": "~12.0.3",
"#angular/router": "~12.0.3",
"moment": "^2.29.1",
"rxjs": "~6.6.0",
"tslib": "^2.1.0",
"zone.js": "~0.11.4"
},
"devDependencies": {
"#angular-devkit/build-angular": "~12.0.3",
"#angular/cli": "~12.0.3",
"#angular/compiler-cli": "~12.0.3",
"#types/jasmine": "~3.6.0",
"#types/moment-timezone": "^0.5.30",
"#types/node": "^12.11.1",
"typescript": "~4.2.3"
}
Then I found the solution in moment doc -
const get_country = moment.tz.guess(true); // Asia/Calcutta
const get_locale = moment.locale(get_country); // en
Im using AngularFire2 in my Ionic 3 Project. I have implemented Facebook and Google Login which worked before but somehow it stopped working (maybe because of changes in the Firebase SDK or Google?).
The problem Im facing now is that once a user logs in through google with redirect he logs in but doesnt get redirect back in my app. Instead google just displays this page on redirect:
Here is the Code im using for SignIn:
private oauthSignIn(provider: AuthProv) {
if (!(<any>window).cordova) {
return this.afAuth.auth.signInWithPopup(provider).then((user) => {
this.user = user.user;
});
} else {
return this.afAuth.auth.signInWithRedirect(provider)
.then(() => {
return this.afAuth.auth.getRedirectResult().then(result => {
this.user = result.user;
});
});
}
}
This code is from the AngularFire2 Documentation itself so I cant find any errors.
This is my package.json:
"dependencies": {
"#angular/animations": "5.2.11",
"#angular/common": "5.2.11",
"#angular/compiler": "5.2.11",
"#angular/compiler-cli": "5.2.11",
"#angular/core": "5.2.11",
"#angular/forms": "5.2.11",
"#angular/http": "5.2.11",
"#angular/platform-browser": "5.2.11",
"#angular/platform-browser-dynamic": "5.2.11",
"#ionic-native/admob-plus": "^5.8.0",
"#ionic-native/app-version": "^4.20.0",
"#ionic-native/core": "~4.20.0",
"#ionic-native/keyboard": "^5.8.0",
"#ionic-native/navigation-bar": "^5.8.0",
"#ionic-native/splash-screen": "~4.20.0",
"#ionic-native/status-bar": "~4.20.0",
"#ionic/storage": "2.2.0",
"#ultimate/ngxerrors": "^1.4.0",
"angularfire2": "^5.2.1",
"cordova-admob-plus": "0.30.0",
"cordova-android": "7.1.4",
"cordova-plugin-app-update": "2.0.2",
"cordova-plugin-app-version": "0.1.9",
"cordova-plugin-appversion": "1.0.0",
"cordova-plugin-device": "^2.0.2",
"cordova-plugin-ionic-keyboard": "^2.1.3",
"cordova-plugin-ionic-webview": "4.1.1",
"cordova-plugin-navigationbar": "1.0.31",
"cordova-plugin-network-information": "git+https://github.com/apache/cordova-plugin-network-information.git",
"cordova-plugin-splashscreen": "^5.0.2",
"cordova-plugin-startapp-ads": "git+https://github.com/lreiner/cordova-plugin-startapp-ads.git",
"cordova-plugin-statusbar": "^2.4.2",
"cordova-plugin-whitelist": "^1.3.3",
"firebase": "^6.1.1",
"ionic-admob": "^0.19.6",
"ionic-angular": "3.9.5",
"ionicons": "3.0.0",
"phonegap-plugin-mobile-accessibility": "git+https://github.com/phonegap/phonegap-mobile-accessibility.git",
"promise-polyfill": "^8.1.3",
"rxjs": "5.5.11",
"sw-toolbox": "3.6.0",
"zone.js": "0.8.29"
},
I have already tried this Solution and added:
<preference name="CordovaWebViewEngine" value="CDVUIWebViewEngine" />
<allow-navigation href="http://*" />
to my config.xml which also didnt change anything.
I also have tried to downgrade
"cordova-plugin-ionic-webview": "4.1.1",
which also didnt work.
My Google WebClient has the right ClientID, Secred and Redirect URL like in the Firebase Console.
So how can I solve this behavior?
We've upgraded our application from Angular 5.2 to 7.2 and the styling got messed up. The spacing between some elements (for example: icons and text) has changed, disappeared or decreased.
Have any of you encountered an issue like this after upgrading an Angular application or the following packages?
I already reverted back every possible package to their staging versions, but it didn't solve the problem.
I have no idea where to start the troubleshooting to find the source of the problem. The styling and the HTML haven't been changed.
We updated:
Bootstrap: from 4.1.0 to 4.3.1
#ng-bootstrap/ng-bootstrap: from 1.1.2 to 4.0.0
ngx-bootstrap: from 2.0.5 to 4.0.0
The styling is global from the angular.json:
Where we import the used Bootstrap components:
The package.json look like this:
{
"private": true,
"dependencies": {
"#angular/animations": "7.2.11",
"#angular/common": "7.2.11",
"#angular/compiler": "7.2.11",
"#angular/core": "7.2.11",
"#angular/forms": "7.2.11",
"#angular/http": "7.2.11",
"#angular/platform-browser": "7.2.11",
"#angular/platform-browser-dynamic": "7.2.11",
"#angular/platform-server": "7.2.11",
"#angular/router": "7.2.11",
"#fortawesome/angular-fontawesome": "0.3.0",
"#fortawesome/fontawesome-svg-core": "1.2.12",
"#fortawesome/free-solid-svg-icons": "5.6.3",
"#ng-bootstrap/ng-bootstrap": "4.0.0",
"#nguniversal/express-engine": "7.1.1",
"#ngx-translate/core": "11.0.1",
"#ngx-translate/http-loader": "4.0.0",
"acorn": "6.1.1",
"angular2-image-zoom": "1.2.1",
"bootstrap": "4.3.1",
"braintree-web-drop-in": "1.16.0",
"core-js": "2.6.5",
"file-saver": "2.0.1",
"font-awesome": "4.7.0",
"htmllint": "0.7.3",
"intl": "1.2.5",
"jquery": "3.3.1",
"ng-jhipster": "0.9.3",
"ng-recaptcha": "4.2.1",
"ng2-order-pipe": "0.1.5",
"ngx-bootstrap": "4.0.0",
"ngx-color-picker": "7.4.0",
"ngx-cookie": "4.1.2",
"ngx-webstorage": "3.0.2",
"popper.js": "1.14.7",
"print-js": "1.0.54",
"rxjs": "6.4.0",
"rxjs-compat": "6.4.0",
"tslib": "1.9.3",
"zone.js": "0.8.26"
},
"devDependencies": {
"#angular-devkit/build-angular": "0.13.7",
"#angular/cli": "7.3.7",
"#angular/compiler-cli": "7.2.11",
"#angular/language-service": "7.2.11",
"#types/file-saver": "2.0.0",
"#types/hammerjs": "2.0.36",
"#types/jasmine": "3.3.12",
"#types/jasminewd2": "2.0.6",
"#types/node": "11.12.0",
"codelyzer": "5.0.0",
"jasmine-core": "3.3.0",
"jasmine-spec-reporter": "4.2.1",
"karma": "4.0.1",
"karma-chrome-launcher": "2.2.0",
"karma-cli": "2.0.0",
"karma-coverage-istanbul-reporter": "2.0.5",
"karma-jasmine": "2.0.1",
"karma-jasmine-html-reporter": "1.4.0",
"node-sass": "4.11.0",
"protractor": "6.0.0",
"sort-json": "2.0.0",
"ts-node": "8.0.3",
"tslint": "5.14.0",
"typescript": "3.2.4"
}
}
I believe from Angular 6 the preserveWhitespace option is false by default. To turn it on again globally you can add an option in tsconfig.app.json:
"angularCompilerOptions": {
"preserveWhitespaces": true
}
Or you can use the directive ngPreserveWhitspaces on any elements where you need the whitespace to be preserved.
See here for some (quite hidden) documentation on it.
I have this following code which works.
<ngb-alert *ngIf="alertError" class="fade animate-show animate-hide" (close)="alertError = false"><strong>{{ message }}</strong></ngb-alert>
<ngb-alert *ngIf="alertSuccess" class="animate-show animate-hide" type="success" (close)="alertSuccess = false"><strong>{{ message }}</strong></ngb-alert>
But if I change to the following it doesn't
<ngb-alert *ngIf="alertError" class="fade animate-show animate-hide" type="danger" (close)="alertError = false"><strong>{{ message }}</strong></ngb-alert>
<ngb-alert *ngIf="alertSuccess" class="animate-show animate-hide" type="primary" (close)="alertSuccess = false"><strong>{{ message }}</strong></ngb-alert>
My package.json is like this.
"dependencies": {
"#angular/animations": "^4.3.4",
"#angular/cdk": "^2.0.0-beta.8",
"#angular/common": "^4.3.4",
"#angular/core": "^4.3.4",
"#angular/forms": "^4.3.4",
"#angular/http": "^4.3.4",
"#angular/material": "^2.0.0-beta.8",
"#angular/platform-browser": "^4.3.4",
"#angular/platform-browser-dynamic": "^4.3.4",
"#angular/router": "^4.3.4",
"#ng-bootstrap/ng-bootstrap": "~1.0.0-alpha.30",
"angular-loader": "^1.6.5",
"bootstrap": "^3.3.7",
"core-js": "^2.4.1",
"font-awesome": "^4.7.0",
"primeng": "^4.1.3",
"rxjs": "^5.4.2",
"screenshot-desktop": "^1.1.0",
"underscore": "^1.8.3",
"zone.js": "^0.8.16"
},
"devDependencies": {
"#angular/cli": "^1.2.7",
"#angular/compiler": "^4.3.4",
"#angular/compiler-cli": "^4.3.4",
"#types/jasmine": "^2.5.53",
"#types/node": "^8.0.19",
"codelyzer": "^3.1.2",
"jasmine-core": "^2.7.0",
"jasmine-spec-reporter": "^4.1.1",
"karma": "^1.7.0",
"karma-chrome-launcher": "^2.2.0",
"karma-cli": "^1.0.1",
"karma-jasmine": "^1.1.0",
"karma-jasmine-html-reporter": "^0.2.2",
"protractor": "^5.1.2",
"ts-node": "^3.3.0",
"tslint": "^5.5.0",
"typescript": "^2.4.2"
}
So, can some expert please tell me what's wrong here? Why type primary or danger won't work.
I ran across a similar issue. My problem was that Angular thought I was passing it a variable from which to read the type from. Obviously there was no variable titled primary so it failed. changing things to [type]="'primary'" solved the issue altogether.
<ngb-alert *ngIf="alertSuccess" class="animate-show animate-hide" [type]="'primary'" (close)="alertSuccess = false"><strong>{{ message }}</strong></ngb-alert>
I think you're just not allowed to use the fade class here.
class="fade animate-show animate-hide"
If I run your code, it only shows me the success.
But if I remove the fade class, it shows both messages.
EDIT
I compared your list of dependencies to mine.
Have you tried updating your libs?
You can run this from the command line:
npm update -D && npm update -S
Dependencies that you have, that I don't :
"angular-loader": "^1.6.5",
"font-awesome": "^4.7.0",
"primeng": "^4.1.3",
"screenshot-desktop": "^1.1.0",
"underscore": "^1.8.3"
I am especially wondering about that first one angular-loader.
Do you know what it's for ? According to its documentation it's a AngularJS dependency.