Write javascript code that works with client side javascript and server side NodeJs modules

Question

Browserify and lo-dash, do something special. Ok, but should like to be free from other vendor libraries or nodejs modules. I want to write reusable code. So, ...

I can write some javascript code. Also, I can write NodeJs code. Ok: I can write a module for NodeJs, for server-side code but at some point I need to write a NodeJs code to export, for example, a module.

var MyModule = function () {
    this.attribute = 666
}
module.exports = MyModule

But, ... it's a NodeJs module. If I try to include it in client page ...

<script src="lib/myModule.js">

I'll get 'Uncaught ReferenceError: module is not defined'. Why? Maybe, because it's NodeJs code, and not Javascript. Ok but, ... Which are best practice to share same code in client and server side with NodeJs. Ok, I can share a javascript file, and use it in both sides. How can I write a module, that works with a javascript code, that I want to use also in client side?

What I am looking for, is:

Write some javascript code. my_public_file.js:

console.log('I am a javascript snippet')

Then, I want to write a module that works with same code. my_module.js

var lib_public_code = require('some/public/path/my_public_file.js')
var MyModule = function () {
    this.attribute = 666
}
module.exports = MyModule

And, also, I wanto to write a public web page (index.html) that works with the same code

<script src="javascript/my_public_file.js">

Best practices? I am insane?

This is what you need browserify.org

elclanrs
– elclanrs

2014-07-10 19:56:08 +00:00
Commented Jul 10, 2014 at 19:56 — elclanrs
– elclanrs, Commented Jul 10, 2014 at 19:56
My problem is on server side, not in client side.

sensorario
– sensorario

2014-07-10 19:56:44 +00:00
Commented Jul 10, 2014 at 19:56 — sensorario
– sensorario, Commented Jul 10, 2014 at 19:56

lante · Accepted Answer · 2014-10-17 14:10:28Z

10

To make it work both client-side and server-side, just export it if module.exports exists:

var MyModule = function () {
    this.attribute = 666;
};

if (typeof module !== "undefined" && module.exports) {
    module.exports = MyModule;
}

This, and similar ways are used by a lot of libraries to enable packages to be used on CommonJS and the browser (e.g.: jQuery)

edited Oct 17, 2014 at 14:10

answered Jul 10, 2014 at 20:28

lante

7,3924 gold badges39 silver badges59 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

taco Over a year ago

Couldn't you just do var MyModule = module.exports = function MyModule(options) {}

lante Over a year ago

no, because on the browser you will get a ReferenceError. That will only work on server side, and thats not the goal.

Dylan · Accepted Answer · 2014-07-11 02:19:45Z

1

You install browserify

$ npm install -g browserify

you take your my_public_file.js whatever node code etc.

var lib_public_code = require('some_file.js')
var MyModule = function () {
   this.attribute = 666
}
module.exports = MyModule

you run the magic

$ browserify my_public_file.js -o bundled_public.js

then it works in the browser and the required files are all there.

<script src="bundled_public.js">

answered Jul 11, 2014 at 2:19

Dylan

4,7831 gold badge22 silver badges27 bronze badges

3 Comments

sensorario Over a year ago

Ok but, ... the question is: how to write reusable javascript code, thus i dont need to browserify or lo-dash?

Dylan Over a year ago

I think the point of browserify, webpack, and others, and bundling your code, and concatenating required files, is that it just handles all the things that would make managing cross platform code painful. Browserify also has many of the modules you may already use on npm converted to browser compatible code, typically the "module" ending in "ify".

sensorario Over a year ago

Another point is just sharing configuration files between server and client sides.

Totty.js · Accepted Answer · 2014-10-15 16:08:26Z

0

Use require.js both on client and on node.js. Already done several apps which shares the code between client and server side.

answered Oct 15, 2014 at 16:08

Totty.js

15.9k31 gold badges114 silver badges180 bronze badges

Comments

Rodson · Accepted Answer · 2015-09-16 14:25:45Z

To write a reusable javascript module. I will use the code below, which will work with browser, nodejs and requirejs.

    (function(root, factory) {
      if (typeof module !== 'undefined' && typeof exports === 'object') {
        module.exports = factory();
      } else if (typeof define === 'function' && define.amd) {
        define([], factory);
      } else {
        root.myModule = factory();
      }
    }(this, function() {
      var myModule = {};
      myModule.publicMethod = function() {};
      return myModule;
    }));

The factory function is being invoked and we can assign it to the relevant environment inside. In nodeJs, export.modules = factory(); . In requireJs, define([], factory);. In the browser, root.myModule = factory();, because root === window, we can use myModule as a global variable.

Collectives™ on Stack Overflow

Write javascript code that works with client side javascript and server side NodeJs modules

4 Answers 4

2 Comments

3 Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

2 Comments

3 Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related