This question already has an answer here:
Polymerfire <firebase-app> element crashes app
(1 answer)
Closed 6 years ago.
I am trying to install and use the Polymerfire <firebase-auth> element. But, apparently, I have not successfully installed all the dependencies like firebase-sdk, for example.
I tried using Bower command pattern used to install the other Polymer elements:
command line
bower install --save polymerfire/firebase-auth
but, apparently, Polymerfire might not be setup for Bower and I received the following error.
fatal: remote error:
Repository not found.
As it stands now, I have the following dependencies listed in the Polymerfire bower.json file:
bower.json
...
"dependencies": {
"polymer": "Polymer/polymer#^1.2.0",
"firebase-sdk": "https://www.gstatic.com/firebasejs/3.0.0/firebase.js",
"app-storage": "polymerelements/app-storage#~0.9.0"
},
...
But I do not, I repeat, I do not, have any firebase-sdk directory in my project's bower_components directory.
Please help me unravel this and correctly install all the necessary dependencies for Polymerfire (including firebase-sdk) into my Polymer project.
Edit
When I do the following command:
command line
bower install --save polymerfire
It appears to work. However, when I check my bower_components directory, I still do not see any firebase-sdk subdirectory and I still get the same console error. Click here to see another question dealing with this error in more detail.
console.log
firebase-app.html:94
Uncaught ReferenceError: firebase is not defined
bower install --save firebase/polymerfire
Note: bower install --save polymerfire points to DivShot's version which is now outdated.
Related
I'm trying to deploy a cloud function on firebase. I'm successfully logged into firebase CLI from osx terminal. When I go to deploy it kicks back this error.
Oops! Something went wrong! :(
ESLint: 7.19.0
ESLint couldn't find the config "google" to extend from. Please check that the name of the config is correct.
it's because you didn't do the install
Would you like to install them now with npm? ยท No / Yes
you can try again configuring json .eslint or you can do it this way
npm install eslint-config-google --save-dev
As explained here: https://eslint.org/docs/user-guide/configuring/configuration-files#using-a-configuration-from-a-plugin
The extends property value can consist of:
plugin:
the package name (from which you can omit the prefix, for example, react is short for eslint-plugin-react)
/
the configuration name (for example, recommended)
Meaning, if you extend your config using the google plugin like this in your .eslintrc.yml:
extends:
- google
you have to install it doing:
npm install eslint-config-google --save-dev
I had the same issue, While trying to debug my error I happen to make some changes in the below code, reverting it back to this way removed the error
Please check in your .eslintrc.js ,if the below code is there or not
extends: ["eslint:recommended", "google"],
Most likely you do not have eslint installed so try to install it by running this command:
npm install eslint-config-eslint --save-dev
After making sure that ESLint is installed, you just need to initialize it by running:
eslint --init
I had this issue and resolved mine running this:
npm install eslint-config-eslint --save-dev
Most likely you didn't have eslint-config-google installed.
Once installed try running ESLint again.
I'm trying to use the npm package flag-icon-css with meteor.
I'm using sass to modify the icons path as follows:
$flag-icon-css-path: '/npm/node_modules/flag-icon-css/flags';
$flag-icon-rect-path: '/4x3';
$flag-icon-square-path: '/1x1';
#import '{}/node_modules/flag-icon-css/sass/flag-icon.scss';
but I'm stuck as i don't understand what is the correct path for the variable $flag-icon-css-path .
the question is simple : how can I access files that are in a npm package ? what is the correct path ? Do I need to export them all explicitly or something similar ?
It turns out that files from npm packages are not directly visible to the client. A solution should be to wrap the npm package in a meteor package and export what is needed to the client explicitly. In this case the solution is to use an already made package for this npm module : meteor add jss:flag-icon
NPM are packages that should be installed. It would then be able to directly adress it:
https://docs.npmjs.com/cli/install
Go in the folder using the prompt, and execute:
npm install
I have forked an npm package on GitHub, made changes to it, and now want to install the package in my Meteor app directly from GitHub.
My package.json looks like so:
{
"dependencies": {
"semantic-ui-react": "git+https://git#github.com/nolandg/Semantic-UI-React.git",
}
}
I then run
meteor npm install
Which appears to work fine and tells me it's installed the package:
semantic-ui-react#0.61.6 (git+https://git#github.com/nolandg/Semantic-UI-React.git#f27d5c736e5de1eed0acf7769f18caee57578526)
And indeed the package appears in the node_modules folder. But when I try to start my Meteor app, I get this error:
Cannot set property '/my-website/node_modules/semantic-ui-react/package.json' of undefined
at Resolver._resolvePkgJsonMain (/tools/isobuild/resolver.js:320:9)
Has anyone successfully install an npm package in a Meteor app directly from GitHub? I can't figure this one out. Thanks!
Meteor version: 1.4.2.3
The main reason why the package does not work when fetching from git is because it is not configured to work that way. This is not a Meteor specific problem, but a problem that a JS developer may face sometimes.
For this particular case there are two problems:
The whitelist files field in package.json only contains src and dist folder. That means when you fetch it by npm almost all config files needed to build the code are gone.
Code for this package requies to be built in order to work with your code. This is done when the author publish it to npm, but you fetch it directly from github so this step is undone.
Because you already folked and modified the package, so let modify the package.json as below (remove all the comments I added them to give you some explanation), push it to github, and fetch it again by npm:
// remove the "files" field
// ...
"scripts": {
// this script is used to build the package
"postinstall": "postinstall-build dist \"npm run build:commonjs\""
// ...
},
"dependencies": {
// this helps build the package
"postinstall-build": "^2.1.3"
},
// ...
Packages are not usually installed from github, they are published, which means that many versions of a package are available, you can choose which one you get. I'm not sure if what you are doing is possible, but it's certainly inadvisable.
If you want to make changes to a github package, you can download the it to your local machine and do npm link, so that it uses your local package instead of the one on npm. Read more about it at https://docs.npmjs.com/cli/link
Why do you not use simple command?
meteor npm install https://github.com/nolandg/Semantic-UI-React.git
I did:
meteor create test
cd test
meteor npm install
meteor add react react-dom
meteor npm install https://github.com/nolandg/Semantic-UI-React.git
meteor
And no errors (-:
With 1.2.*, I used to build my staging/production bundles with meteor build, then moving into ./bundle/programs/server and npm install there.
I do the same thing with 1.3 version but now I have error message on trying to run bundle main file with node:
WARNING: npm peer requirements not installed:
- react#0.14.x not installed.
- react-addons-pure-render-mixin#0.14.x not installed.
Read more about installing npm peer dependencies:
http://guide.meteor.com/using-packages.html#peer-npm-dependencies
/var/www/builds/1459320997/bundle/programs/server/node_modules/fibers/future.js:267
throw(ex);
^
Error: Can't find npm module 'react'. Did you forget to call 'Npm.depends' in package.js within the 'modules-runtime' package?
I use react-meteor-data meteor package.
However, I already have "react": "^0.14.8", and "react-addons-linked-state-mixin": "^0.14.8", in my package.json and of course installed it with npm install ... --save and it is working fine on development environment when I use meteor command.
Any additional actions needed to run it? Did they change how meteor package should be build for production and didn't changed their docs? (because I don't see any changes in docs concerning meteor build so far.
Update: I tried to manually npm install these packages into ./bundle/program/server. Now they consequentially requires packages already listed in my package.json. I suppose Meteor just ignore this file on bundle. Will try to add a bug in their tracker.
I used Meteor 1.2 to build new 1.3 code so it is the issue. It happened because currently I build on the server that had another Meteor version.
I used answer from another Stackoverflow user (Ian) Updating all Meteor packages to latest versions
Easiest way is to delete the contents of .meteor/versions and then save
In a meteor project, I want to pull a few frontend packages. bower can pull many frontend dependencies which are not yet available using meteor add. In many cases, when the meteor packages are available, their versions are lagging behind the official ones, sometimes too behind to consider.
Being a bit of a Meteor newb I've tried to install bower (the most recent meteor bower package I could find):
$ meteor add bozhao:bower
but then, when I run the meteor server it crashes:
W20160110-15:37:57.997(2)? (STDERR) /Users/igal/.meteor/packages/meteor-tool/.1.1.10.7bj3ks++os.osx.x86_64+web.browser+web.cordova/mt-os.osx.x86_64/dev_bundle/server-lib/node_modules/fibers/future.js:245
W20160110-15:37:57.998(2)? (STDERR) throw(ex);
W20160110-15:37:57.998(2)? (STDERR) ^
W20160110-15:37:57.998(2)? (STDERR) ReferenceError: window is not defined
W20160110-15:37:57.998(2)? (STDERR) at bower_components/leaflet/dist/leaflet-src.js:526:1
Question is:
What's the best strategy to install bower and use it in a meteor project? An acceptable answer may show the flow for correctly installing bower, then the leaflet package and it's leaflet.markercluster extension
Sep 27th 2016 edit
The meteor community switched to npm, thus using bower is no longer required. Simply do npm install <package> and import <package> in your client-side code, and you can start using the component!
meteor search bower turns up a few hits, which I haven't taken the time to compare in any depth. I went with mquandalle:bower as I found it recommended here. Perusing the doc, here is what worked for me:
npm install -g bower # If not already done
meteor add mquandalle:bower
echo '{ "directory": ".meteor/local/bower" }' > .bowerrc # If you use bower install --save
Then create a bower.json file at the top of the project tree that reads like this:
{
"name": "MyApp",
"version": "0.0.1",
"dependencies": {
"leaflet": ">0",
"leaflet.markercluster": ">0"
},
"private": true
}
Re-run your app with meteor run and presto, the stylesheets and JavaScript of your modules are embedded into your page without even having to edit the <head>.