I'm using the meteor framework, and trying to use google sheets to visualize some of my app's data. But for whatever reason, I can't seem to get the google api to load. I started with the command npm i googleapis and adding const {google} = require('googleapis') Which is to my knowledge correct. However, when I console.log(google) it spits out undefined.
I'm running Meteor 1.8.1, Node 6.12.0, and googleapi ^39.2.0
I would love to know what I'm doing wrong, most other people with this issue needed to update various other packages, so I've already run npm update To no avail, I've tried using import { google } from 'googleapis' Also to no avail, I saw somewhere that that would require transformations or something, but it still spits out undefined
I noticed that if I run require('googleapis') from my meteor shell, then it returns all the methods and whatnot that it's supposed to.
Ok, how I do it, to prevent adding another NPM to my Meteor projects ...
In my main.html I have this line:
<link rel="dns-prefetch" href="//maps.googleapis.com">
The next example shows adding google maps. I first make sure that, in a session, I load this library maximum once.
I call this code in multiple pages as I need the API. Since I use react, I do i in 'componentDidMount'.
if (!(window.google && window.google.maps)) {
const script = document.createElement('script')
script.src = 'https://maps.googleapis.com/maps/api/js?key=xxxxxxxxx&libraries=places'
script.defer = true
document.head.appendChild(script)
}
Removing my node_modules and running npm i did the trick
Related
I'm attempting to run music21j in node js ( repo link , npm link ).
I get ReferenceError: self is not defined
When trying to simply initialize music21j:
const music21 = require('music21j');
const n = new music21.note.Note('F#');
Does this mean it's not possible to run outside of the browser, or am I somehow initializing to the wrong environment?
The github documentation states
...or use it in your javascript/typescript project
, hence my confusion.
From the github repo:
At present it's not possible to run outside of the browser. :-( But we're working on removing certain JQuery patches that should make it easier to do. You may however need to use ES6-style imports.
Installed the google cloud pub sub following instructions from the following link,
https://cloud.google.com/pubsub/docs/reference/libraries
Imported that as the following,
const { PubSub } = require("#google-cloud/pubsub");
const projectId = "projectXYZ";
const pubSubClient = new PubSub({ projectId });
export async function publishMessage(topicName, data) {
return await pubSubClient.topic(topicName).publish(JSON.stringify(data));
}
this leads to the following error,
Now, what I have observed is that the code below the import has no significance in this issue, since this error still appears even if I only import on the first line.
Am I missing something or required to install something more that just the package?
Any help is deeply appreciated.
Thank you in advance.
Library maintainer here! I'm guessing from the stack trace that you're using webpack on your app? Right now we don't have webpack and rollup support - there are a few weird things like what you see above. Your code looks okay. We'd like to get webpack and similar tools working at some point for server-side usage, but it hasn't gone very high on the priority list just yet. I think the previous assumption was that people were trying to use it in a web browser, which we don't recommend for a number of reasons (most prominently, security concerns with GCP credentials). But I've been seeing a lot of issues with users trying to use webpack on the server side to make their Cloud Functions more compact, which seems pretty legit. I'll bring it up in our next team sync.
If you're not using webpack, then that sounds like something that might be filed over at the issue tracker.
I'm using Sails js and I want to use a nodejs module.
I also use React js.
I want to use react-bootstrap-datetimepicker in my javascript script.
react-bootstrap-datetimepicker
I installed my module with npm install react-bootstrap-datetimepicker
I tried in config/boostrap.js to add this line var DateTimeField = require('react-bootstrap-datetimepicker');, but DateTimeField isn't recognised in my js script.
Uncaught ReferenceError: DateTimeField is not defined
I also tried to add this line directly in my script, but I have this error:
ReferenceError: Can't find variable: require
And also this one in my script: import DateTimeField from "react-bootstrap-datetimepicker";
I have all these errors in the navigator console.
EDIT 1:
I understand what you said, thank you for your answer.
BUT, for example with react-bootstrap, I can use:
var Input = ReactBootstrap.Input;
var ButtonInput = ReactBootstrap.ButtonInput;
There is exactly the same architecture with react-bootstrap-datetimepicker, so I maybe I can do the same?
var DateTimePicker = ... . DateTimePicker
I tried to include like you said, but it doesn't recognise DateTimePicker.
Here is the doc:
Installation :
npm install react-bootstrap-datetimepicker
Then
javascript
var DateTimeField = require('react-bootstrap-datetimepicker');
render: function() {
return <DateTimeField />;
}
See (examples/) for more details.
And in examples/, the line is:
import DateTimeField from "react-bootstrap-datetimepicker";
Ok, first you have to understand the division of server side and client side javascript, even thought you are using the same language, and you can share libraries, bare in mind, that for client side js you need to supply the user browser with the libraries and scripts it needs, so those have to be in the html you serve the user. When you require any module in sails bootstrap or similar, you are loading the script into the server memory, not serving it to the users browser, that means you can use in the server code, but not in client code.
For you use case, you have to download the library code, and put it in your assets/js folder and if you have the script tags in the layout, sails will automatically inject it there for you, but if not or you are using other template engine like jade, just manually add it.
example:
<html>
....
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/<react-version>/react.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/<react-version>/react-dom.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react-bootstrap/<version>/react-bootstrap.min.js">
<script src='/js/react-bootstrap-datetimepicker.min.js'></script>
// The other js files that depend on datetimepicker go here
</html>
Now just to be clear, require is a node.js function, node.js is not the same as javascript, its a piece of software with its own functions, thats why you are getting an error related to it when trying to use it in the browser, there is no require method there, so you can't use it, at least not directly. You can use browserify to sort of emulate the node workflow, where you have a node_modules folder and use require on those, browserify will bundle (search for the modules and merge them) and give you a javascript file that you can then link in your html code. That is more setup work, and unless you really need it, because you have a lot of files, i think is not worth the effort.. lets say for just one file using require.
So i think you were misguided by that github repo, because it says npm-install. Just ignore it (unless you use browsefify like i said) and download the link i gave you above ( the .min.js).
So to sumarize, you issue have nothing to do with sails, just link the library in the html you provide to the user, like any other client side script.
1) In node on the backend to link one javascript file to another we use the require statement and module.exports.
This allows us to create modules of code and link them together.
How do the same thing in Meteor?
2) On the front end, in Meteor is I want to access a code from another front end javascript file, I have to use globals. Is there a better way to do this, so I can require one javascript file in another file? I think something like browserify does this but I am not sure how to integrate this with Meteor.
Basically if on the client I have one file
browserifyTest.coffee
test = () ->
alert 'Hello'
I want to be able to access this test function in another file
test.coffee
Template.profileEdit.rendered = ->
$ ->
setPaddingIfMenuOpen()
test()
How can I do this in Meteor without using globals?
Meteor wraps all the code in a module (function(){...your code...})() for every file we create. If you want to export something out of your js file (module), make it a global. i.e don't use var with the variable name you want to export and it'll be accessible in all files which get included after this module. Keep in mind the order in which meteor includes js files http://docs.meteor.com/#structuringyourapp
I don't think you can do this without using globals. Meteor wraps code in js files in SEF (self executing function) expressions, and exports api is available for packages only. What problem do you exactly have with globals? I've worked with fairly large Meteor projects and while using a global object to keep my global helpers namespaces, I never had any issues with this approach of accessing functions/data from one file in other files.
You can use a local package, which is just like a normal Meteor package but used only in your app.
If the package proves to be useful in other apps, you may even publish it on atmosphere.
I suggest you read the WIP section "Writing Packages" of the Meteor docs, but expect breaking changes in coming weeks as Meteor 0.9 will include the final Package API, which is going to be slightly different.
http://docs.meteor.com/#writingpackages
Basically, you need to create a package directory (my-package) and put it under /packages.
Then you need a package description file which needs to be named package.js at the root of your package.
/packages/my-package/package.js
Package.describe({
summary:"Provides test"
});
Package.on_use(function(api){
api.use(["underscore","jquery"],"client");
api.add_files("client/lib/test.js","client");
// api.export is what you've been looking for all along !
api.export("Test","client");
});
Usually I try to mimic the Meteor application structure in my package so that's why I'd put test.js under my-package/client/lib/test.js : it's a utility function residing in the client.
/packages/my-package/client/lib/test.js
Test={
test:function(){
alert("Hello !");
}
};
Another package convention is to declare a package-global object containing everything public and then exporting this single object so the app can access it.
The variables you export NEED to be package-global so don't forget to remove the var keyword when declaring them : package scope is just like regular meteor app scope.
Last but not least, don't forget to meteor add your package :
meteor add my-package
And you will be able to use Test.test in the client without polluting the global namespace.
EDIT due to second question posted in the comments.
Suppose now you want to use NPM modules in your package.
I'll use momentjs as an example because it's simple yet interesting enough.
First you need to call Npm.depends in package.js, we'll depend on the latest version of momentjs :
/packages/my-moment-package/package.js
Package.describe({
summary:"Yet another moment packaged for Meteor"
});
Npm.depends({
"moment":"2.7.0"
});
Package.on_use(function(api){
api.add_files("server/lib/moment.js");
api.export("moment","server");
});
Then you can use Npm.require in your server side code just like this :
/packages/my-moment-package/server/moment.js
moment=Npm.require("moment");
A real moment package would also export moment in the client by loading the client side version of momentjs.
You can use the atmosphere npm package http://atmospherejs.com/package/npm which lets you use directly NPM packages in your server code without the need of wrapping them in a Meteor package first.
Of course if a specific NPM package has been converted to Meteor and is well supported on atmosphere you should use it.
I'm running node on my vps server. node is at my root, my app.js with node_modules (express, socket.io) are in /home/vps/public_html/
when following github readme for setting up sendgrid i run into trouble:
config.js is not live by the sounds of it as when I run sendgrids simple code example if i
a.) refer to config.js by doing:
var sendgrid=new SendGrid(user,key);
node kills its self because user is not defined.
b.) bypass config.js by doing:
var sendgrid=new SendGrid({user:'my_user_name',key:'my_password'});
I get console.log(message) of [ 'Permission denied, wrong credentials' ]
here is another image this one is of my public_html structure:
does any one know how to activate this config.js?
Should I have installed node.js into my public_html in the beginning?
So, there are a few things wrong here:
1) We have a typo in the README (which has now been updated)
tl;dr - you should type npm test not make test
Essentially, you're typing make test and make is coming back and saying "Hey, there's no rule for test in the cwd. It doesn't look like there's anything for me to do. Bye!". If you look carefully, there is no Makefile in the node library, so there's obviously not going to be any rules. So make definitely won't work in this case. What the README should have said is npm test. NPM is the package manager for node and it has a helper method test which runs all the tests for a given module.
Also, just to be clear - when you're typing npm test, all you are doing is running the tests for the library. Really this should only be necessary if you're adding features or fixing bugs on the library itself. If you're trying to use the library to send email, you should read the section titled "Usage".
2) You have a typo in your code (which is why the other sample didn't work)
Your code looks like this:
var sendgrid = new SendGrid({user:'my_user_name', key:'my_password'});
The code sample that we provide looks like this:
var sendgrid = new SendGrid(user, key);
Notice the difference? You're passing in a javascript object and we're expecting two discrete string values instead. The library is interpreting that as your username is "{user:'my_user_name', key:'my_password'}" with no password (because you didn't provide a second parameter). Instead you should do the following:
var sendgrid = new SendGrid("my_user_name", "my_password");