When trying to latest ngrx/store in angular 11, it is giving warning to install angular 10.
#ngrx/store#10.1.2 requires a peer of #angular/core#^10.0.0 but none is installed. You must install peer dependencies yourself.
Following is package json
"dependencies": {
"#angular/animations": "^11.0.5",
"#angular/cdk": "^11.0.3",
"#angular/common": "^11.0.5",
"#angular/compiler": "^11.0.5",
"#angular/core": "^11.0.5",
"#angular/forms": "^11.0.5",
"#angular/material": "^11.0.3",
"#angular/material-moment-adapter": "^11.0.3",
"#angular/platform-browser": "^11.0.5",
"#angular/platform-browser-dynamic": "^11.0.5",
"#angular/router": "^11.0.5",
"#fortawesome/fontawesome-free": "^5.15.1",
"#ngrx/store": "^10.1.2",
"#popperjs/core": "^2.6.0",
"bootstrap": "^4.5.3",
"classlist.js": "1.1.20150312",
"core-js": "^3.8.1",
"jquery": "^3.5.1",
"moment": "^2.29.1",
"oidc-client": "^1.10.1",
"popper.js": "^1.16.1",
"rxjs": "~6.6.3",
"sass-loader": "~6.0.7",
"tslib": "^2.0.3",
"web-animations-js": "^2.3.2",
"zone.js": "^0.10.3"
}
npm install gives following WARN
npm WARN #ngrx/store#10.1.2 requires a peer of #angular/core#^10.0.0 but none is installed. You must install peer dependencies yourself.
How to handle this situation?
that's totally, fine.
Currently (01.01.2021), there is no ngrx version for A11 (no version 11), but version 10 works perfectly with A11 and you can use it, despite the warning.
If this is the only warning you get, then feel free to add --force flag to proceed with the upgrade.
Related
https://github.com/angular/angularfire/blob/HEAD/docs/auth/getting-started.md#5-getting-started-with-firebase-authentication
I'm trying to use new firebase.authGoogleAuthProvider() and I can't import firebase. I've installed:
"dependencies": {
"#angular/common": "^14.0.0",
"#angular/core": "^14.0.0",
"#angular/fire": "^7.4.1",
"#angular/forms": "^14.0.0",
"#angular/platform-browser": "^14.0.0",
"#angular/platform-browser-dynamic": "^14.0.0",
"#angular/router": "^14.0.0",
"#ionic-native/google-plus": "^5.36.0",
"#ionic-native/sign-in-with-apple": "^5.36.0",
"#ionic/angular": "^6.1.9",
"#jest/globals": "^28.1.1",
"#microsoft/applicationinsights-web": "^2.8.5",
"angularfire2": "^5.4.2",
"cordova-plugin-googleplus": "^8.5.2",
"cordova-plugin-sign-in-with-apple": "^0.1.2",
"firebase": "^7.9.0",
"rxjs": "~6.6.0",
"tslib": "^2.2.0",
"zone.js": "~0.11.4"
},
Here's a screenshot of the node_modules/#firebase
Here's one of the node_modules/firebase
Somewhere I found that I should use this import but as you see, this path doesn't exist. Any suggestions?
import firebase from 'firebase/compat/app';
firebase/compat appeared only in firebase v9, i see you are using "firebase": "^7.9.0" in your package json so npm will install latest version prior to v8.
To check installed firebase version - see package.json file inside node_modules/firebase directory.
To use import firebase from 'firebase/compat/app'; as per your guides - update firebase version in your package.json file and rerun npm install. Latest version is 9.9.0 so it will be "firebase": "~9.9.0" or "firebase": "^9.9.0"
More details at https://firebase.google.com/docs/web/modular-upgrade
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 imported and downloaded: firebase-functions and firebase-admin using npm i <package> but it give me a lint error like: cannot find module "firebase-functions". I also restarted vscode, but problem persists..
Could it be problem with webpack or tsconfig?
Some important packages in package.json:
{
"dependencies": {
"#angular/animations": "^5.2.3",
"#angular/cdk": "^5.1.1",
"#angular/common": "^5.2.2",
"#angular/compiler": "^5.2.2",
"#angular/core": "^5.2.2",
"#angular/forms": "^5.2.2",
"#angular/http": "^5.2.2",
"#angular/material": "^5.0.2",
"#angular/material-moment-adapter": "^5.2.3",
"#angular/platform-browser": "^5.2.2",
"#angular/platform-browser-dynamic": "^5.2.2",
"#angular/platform-server": "^5.2.3",
"#angular/router": "~5.2.2",
"core-js": "^2.5.3",
"express": "^4.16.2",
"firebase": "^4.9.1",
"firebase-admin": "~5.8.1",
"firebase-functions": "^0.8.1",
"zone.js": "0.8.18"
},
"private": true,
"devDependencies": {
"#angular/cli": "^1.6.7",
"#angular/compiler-cli": "^5.2.2",
"#angular/language-service": "^4.2.4",
"#types/jasmine": "~2.5.53",
"#types/jasminewd2": "~2.0.2",
"#types/node": "~6.0.60",
"angular-universal-express-firebase": "0.0.4",
"babel-preset-es2015": "^6.24.1",
"codelyzer": "~3.1.1",
"jasmine-core": "~2.6.2",
"jasmine-spec-reporter": "~4.1.0",
"karma": "~1.7.0",
"karma-chrome-launcher": "~2.1.1",
"karma-cli": "~1.0.1",
"karma-coverage-istanbul-reporter": "^1.2.1",
"karma-jasmine": "~1.1.0",
"karma-jasmine-html-reporter": "^0.2.2",
"npm-run-all": "^4.1.2",
"protractor": "~5.1.2",
"ts-loader": "^3.4.0",
"ts-node": "~3.2.0",
"tslint": "~5.3.2",
"typescript": "^2.4.2",
"webpack": "^3.8.1",
"webpack-node-externals": "^1.6.0"
}
}
npm install firebase-functions
npm install firebase-admin
You can try the following commands:
firebase use --add
firebase init functions
To get your project. Sometimes, its a permission problem. What you can try is creating a new account on your computer and doing the same commands, that almost always works.
I handled this problem with these steps. I don't really know whether exact solution is delete and initialize firebase functions again. Also I thought that problem is not specific only firebase-functions or firebase-admin. It can be missing node_modules packages.
delete node_modules in functions
firebase init functions. Update tsconfig and package.json and install dependencies.
restart vscode
#Shaybakov answer was the solution to my problem.
I recently switched the location of my project on my local machine. This meant that firebase libraries were not imported into the local directory and I either had to reconfigure the entire firebase CLl or just manually update the firebase libraries in the local directory with the commands that #Shaybakov stated.
npm install firebase-functions
npm install firebase-admin
step 1. npm install firebase-admin
step 2. npm install firebase-functions
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.
I have a project using meteor.js and Angular2.
This is how my package.json looks:
"dependencies": {
"#angular/common": "2.0.0-rc.3",
"#angular/compiler": "2.0.0-rc.3",
"#angular/core": "2.0.0-rc.3",
"#angular/forms": "0.1.1",
"#angular/http": "2.0.0-rc.3",
"#angular/platform-browser": "2.0.0-rc.3",
"#angular/platform-browser-dynamic": "2.0.0-rc.3",
"#angular/router": "3.0.0-alpha.8",
"#angular/upgrade": "2.0.0-rc.3",
"angular2-meteor": "^0.5.6",
"angular2-meteor-polyfills": "0.1.1",
"angulartics2": "^1.1.1",
//more dependencies...
}
After installing dependencies with meteor npm install and then launching app with meteor I get errors:
off course I tried meteor npm install --save angular2-meteor, but I get same error.
Then I read somewhere to update node and npm, I did I have tried with node 5*, 6* and latest npm. But I still get error with Angular2 dependencies.