importing npm package to client side javascript - javascript

I recently trying to use some client-side github packages, and when trying to use them the developers mentions that the packages are downloadable with npm, which I cant understand due to the fact that those are client side javascript packages.
I saw something with import method which I also don't know.
can someone please explain how npm suppose to be used on client side, or how else am I suppose to use those packages?
an example is html2canvas, I just can't figure out how to actually use this package.
much thanks!

Usage and installation for html2canvas is described below:
https://www.npmjs.com/package/html2canvas
In nutshell npm packages usage can be explained so:
Install package using npm
Import required class/functionality from node_modules
Use as in documentation:
html2canvas(document.body).then(function(canvas) {
document.body.appendChild(canvas);
});
Bundler will attach all required functionality by itself.

Related

Why I get window is not defined error on NODE JS after I install watermarkJS

I just install watermarkjs (npm i watermarkjs) and I get error
Does anyone know maybe any other service that I can use with NODEJS and Sharp that can allow me to put watermark on image
From the documentation:
A functional library for watermarking images in the browser.
Not all libraries distributed via NPM are designed for use with Node.js. You'll need to find a library that is compatible with Node.

Using Redux in Meteor.js

I'm a newbie to Meteor.js and working on a project where I'm also using Redux so I added the kyutaekang:redux package. The problem is that I don't know how to import Redux to use it. I tried:
import { createStore } from 'redux';,
but when I start the app I get
[Error: Unable to fetch "redux". Only file URLs of the form file:/// allowed running in Node.].
Meteor does not yet support the ES2015 import out of the box (might be available in 1.3.0). Therefore, you will need a modern module bundler, as also described in the package's Readme file:
This assumes that you’re using npm package manager with a module bundler like Webpack or Browserify to consume CommonJS modules.
You can take a look at this excellent example by Adam Brodzinski to get you started.
Edit:
After taking a closer look at the package, it does not seem to contain any code.
Nonetheless, my recommendation about Adam's repo (or his other repo, pointed in the comments) still remains as a nice, clean implementation.

How to use podio-js in the browser (without Node.js)?

I'm sorry if this doesn't count as a "Programming Question" but I found it relevant since this will make me able to do programming in the Podio API.
My question/problem is that I can't figure out the correct way to set up the Podio JavaScript SDK/API scripts. I followed "http://podio.github.io/podio-js/" but it really only explains so much.. Mostly about Node and that I need to use Node for it, but isn't there another way like simple Ajax calls?
Reason being, I don't have the possibility of running a Node server in my server background, just to make API calls, it may be effective but it sounds kind of stupid when so many other API's out there doesn't require this.
Thoughts?
podio-js is a Podio JavaScript SDK for node and the browser.
... which means you don't necessary need Node.js. To use NPM module in the browser you'll need a bundler, like Webpack:
npm install podio-js --save
npm install webpack --save-dev
Then in your app.js:
var podio = require('podio-js');
// follow the tutorial
To bundle the app:
./node_modules/.bin/webpack app.js app.bundle.js
Then include the bundle in your HTML via script tag and voilà:
<script src="app.bundle.js"></script>

Why is underscore installed using npm or bower?

I'm very new to underscore, node, npm etc but I think I'm getting the hang of it. However, I just went on to the underscore.js site to get a copy of it and I saw that there is an option to install via npm or bower. Out of curiosity I ran the install in the rood directory of my project but nothing happened. I'll just link to the underscore library in my index.html, so no worries there. However I don't understand why it is even an option to install with npm. Could someone kindly explain this?
This is in the case you want to require underscore for your server-side code. Then you can add it to your package.json just like any another dependency.
There is nothing browser specific about underscore.js. There is an optional to install it via NPM because people use it with Node.js.
Bower, on the other hand, is a tool for managing client side JS dependancies for websites, so (assuming you are using it to manage your websites JS libraries) you can use it with your website.

Use natural nodejs library in Meteor project

I need to use natural (https://github.com/NaturalNode/natural), a nodejs library inside a Meteor project.
If I install natural using npm inside my Meteor project, it throws a bunch of erros becouse certain aspects are incompatible: (Doctype HTML in html file headers, for example, which meteor doesn´t like much.)
Can anyone teach me how to turn natural in an meteor package or just tell me how to solve this problem?
Thanks,
Try this project. I haven't tried it myself, but there are likely some leads there.
Try this package in Atmosphere (a collection of Meteor packages) https://atmospherejs.com/package/natural
To install packages from Atmosphere,
You will need meteorite:
npm install -g meteorite
install the package:
mrt add natural
run your project
mrt
Easy this time ;) Enjoy!

Categories