how to use a bower package in nodejs? - javascript

I installed bower from NPM and then i installed a bower package Crypto-js.
Is it possible to use this package in my node js code by simply writing require
Like this
var crypt= require('./package path/md5');
var hash= crypt.MD5('Message');
console.log(hash.toString(crypt.enc.Base64));
Here my point is not about only this library, i want to ask if this is the way to use bower package in nodejs or is there any other way to use bower package in nodejs?

bower is for front-end and it is not exported for node.js
you should use npm package https://www.npmjs.com/package/crypto-js instead

There are two things
bower is package for web build by twitter
and as you already aware that nodejs is server side
So you can't use bower in nodejs server-side application.
And even if you use bower in front end, it's done by using script tags.
for more refer this blog

Related

Does npm install mean the script only works with Node.js

I'm trying to use an API via it's helpfully developed JS SDK. So the SDK instructions on the GitHub page are to npm install. I'm wondering though, does this imply I have to have Node.js because the SDK has been written specifically for it, or if I just have basic vanilla JS/jQuery, can I just.... Copy the source code from GitHub into my scripts or use it some other way?
It means that the project is using npm to handle dependencies. It has a package.json file that stores what those dependencies are, and npm install will download them into a folder usually called 'node_modules.'
It's dependency management. It doesn't mean it's written for node, but that it uses node to download external dependencies.

How to use NPM modules?

I'm completely new to frontend web dev with a very basic question. Once I npm install something, how do I actually use it? For example, I just did npm install bootstrap, and I would now like to be able to use the CSS and Javascript that it downloaded. I'm sure I shouldn't have to dig through the directories to find some entry point... so how do I now use bootstrap in my webpage?
Most modules on NPM are used in Node.js, for the server (backend). Node.js has a built-in function require('your-module') to make use of the module. This function is not present on the frontend in the browser. However, there are tools like browserify or webpack and probably others to make the NPM modules and the require function work in the frontend.
If you're just starting out I suggest you take a look at Bower first. With Bower (installed with NPM though) you can pull in all your frontend libraries like jQuery, Bootstrap, etc. to your project folder and you can point your script tags in your HTML to the bower_components/ directory, e.g. <script src="/bower_components/jquery/jquery.min.js"></script>. You can save a list of all libraries used with a version number in a json file called bower.json in the root of your project folder.
Based on this file you can pull in or update all the libraries listed with the use of the command line.
As a really general rule, npm is used for assets your node app will use on the server, while bower (and others) are the equivalent for dependencies that you want to use on the client.
That said, the use is basically the same.
npm (and bower) install the files into your project directory in a standard location. All you really have to do is make sure that location is accessible via a web request (typically, node_modules is not; which is why bower came about), and then embed link and script tags as appropriate in your html:
<script src='/node_modules/bootstrap/js/bootstrap.min.js'></script>

Sharing code between AngularJS and Nodejs

What is the best way of sharing code between frontend and backend using javascript, specifically saying between nodejs and angularjs?
Thing is that we are using same enums and constant values such as error codes in both backend and frontend. Right now we just copy&paste each change to both platform which isn't a good solution. There are also some services that could be shared.
I have seen libraries such as browserify; but thats not exactly what I am looking for. I am looking for a solution similar to maven dependency in java. In java, libraries can be shared easily using maven, whereas I can't find a similar way of doing that in javascript.
Is there a way to isolate these services and give them as dependency to nodejs using npm and to angularjs using bower independently? Or what are the ways for sharing the same code between frontend and backend?
There are several ways to do this. The first is that you can make a new package which is required via bower for the front-end code and via npm for the backend code. I have several packages published to both systems.
Install with Bower -- information on how to install modules that aren't in the registry
NPM Install docs -- all the ways to install with npm (private github with auth: git+ssh://git#github.com/[org]/[repo])
Just create a new module with your shared data and install it using both package managers. Both of them allow you to install an unpublished module so if it's private data you can keep it as such.
If your front end requires require.js you can use something like amdefine to make it available to your node backend, or if you're just using legacy window code you can do something like:
var mydata = {};
if(typeof window !== 'undefined'){
window.mydata = mydata;
} else {
module.exports = mydata;
}
If you are sharing a lot of data though I highly recommend looking into browserify to write your entire codebase in commonjs and using browserify to generate your client bundle. There is a laundry list of resources about using browserify, including stuff on how to use browserify and angular together
Disclaimer - I'm still developing this approach and it's a little manual.
I did this using npm, an npm cli called pac, and bower. Pac let's me avoid using npm install in production by keeping the modules as .tgz files (committed to project in source control). With pac, when someone checks out the node project, they run pac install then npm rebuild instead of npm install.
My shared code is kept in a directory (my-module). It has both package.json and a bower.json.
My consuming node app has a package.json dependency for:
"my-module" : "x.y.z"
My consuming client has a bower.json dependency for:
"my-module" : "../relative/path/to/my-module"
When I make updates to my-module, I update my node app by:
Making a tar.gz of the contents of my-module:
tar -czvf my-module.tar.gz -C my-module
Removing the old version from the node app's node_modules
Rerunning npm install path/to/my-module-tar.gz
Rerunning pac (this makes a .tgz of node_modules/my-module)
Committing the updated pac .modules/my-module.tgz
I update my client by:
Removing the old client/bower_components/my-module
Rerunning bower install or bower update

Bower install dependency to a specific subdirectory

How do I install a dependency into a specific subdirectory using Bower? I'm working on an application built on AngularJS that requires localization. One of the libraries I'm using is looking for localization files in angular/angular_i18n. However, I'm developing with Angular 1.2 rc3 and the localization files are not part of the package so I have to install them separately.
How can I bower install angular-i18n into components/angular/angular-i18n/?
Help would be totally appreciated.
You can't. Bower uses a single location to store packages. However you can use tools like one of these grunt tasks to copy it over in the build-step.
you can also try to use this fork: https://github.com/hyperweb2/upt
that also implements subdirectory installation feature

How do we or can we use node modules via npm with Meteor?

How do we or can we use node modules via npm with Meteor?
Or is that something that will be dependent on the packaging API?
Or is there a prescribed method that is recommended?
Meteor 1.3, released on March 28, 2016, gives apps full ES6 (ES2015) modules support and out of the box NPM support. Apps and packages can now load NPM modules directly and easily on the client and on the server.
If you can use 1.3, then check http://guide.meteor.com/using-packages.html#installing-npm.
For example, to use moment.js:
meteor npm install --save moment
Then in your code:
import moment from 'moment';
// this is equivalent to the standard node require:
const moment = require('moment');
If you need to use an older version of Meteor, read the rest of the answer below.
Pre-Meteor 1.3:
Since v0.6.0, Meteor integrates directly with NPM modules with the help of a 3rd party package. For example, to use a module like ws,
Run sudo npm install -g ws (or for local installs, see this)
In your sever JavaScript file,
var Websocket = Npm.require('ws');
var myws = new Websocket('url');
To use a core Node module, just make the corresponding Npm.require() call, e.g. var Readable = Npm.require('stream').Readable.
You can use any of the more than 230,000 NPM modules directly with Meteor thanks to the NPM package developed by Arunoda.
You can also define dependencies on Npm packages from smart packages - from the initial announcement of npm support:
Your smart package can now define dependencies directly, by adding a call to Npm.depends in package.js:
Npm.depends({
"awssum": "0.12.2",
"underscore.string": "2.3.1"
});
All of this works well with hot code reload, just like the rest of Meteor. When you make changes, the bundler will automatically download missing npm packages and re-pin its dependencies.
To use an NPM module within server code, use Npm.require as you would normally use plain require. Notably, __meteor_bootstrap__.require has been eliminated and all of its uses have been converted to Npm.require.
There is a small example of using an NPM module in your application.
Note that this answer applies to versions of Meteor prior to 0.6.0, which was released in April 2013 and added direct npm integration
Install modules as you normally would through npm and then use
var require = __meteor_bootstrap__.require,
pd = require("pd"),
after = require("after") // etc
Load any modules you want
I did a complete write-up on this on Meteorpedia:
http://www.meteorpedia.com/read/npm
The article covers how to use npm in both your app and/or packages, and common patterns for wrapping regular callbacks and event emmitter callbacks to work properly in Meteor and Fibers, and include's references to Arunoda's async-utilities and additional resources.
You could use the Meteor Npm package
meteor add meteorhacks:npm
Then create a packages.json file in your project's root directory with the NPM module's info.
{
"redis": "0.8.2",
"github": "0.1.8"
}
Then as simple as (server side)
var github = Meteor.npmRequire("github");
var redis = Meteor.npmRequire("redis");
So you just use Meteor.npmRequire instead of require
I wrote a Gist on how to do this as of Meteor 0.6.5, How to add Node.js npms to your Meteor.js project.
I am using such a script which nicely install all Node.js dependencies. It behaves similar to the official support in the Meteor engine branch (it installs dependencies at runtime), but it also supports installing from Git repositories and similar goodies.

Categories

Resources