How can I make my JavaScript library global?

Question

I want to create a JavaScript library and have it readily available everywhere, exactly as Moment.js does. For example, when I import Moment.js I can use it wherever I want by just typing:

moment.someMomentFunction()

Similarly, I'd want to call my function from everywhere by just doing:

mylib.function1()

mylib.function2()

etc..

Looking at the Moment.js source code I cannot see any reference to the window object (which is the one you should use if you want your object to be global)

_"I cannot see any reference to the window object..."_ Because they do it like this --> `moment = this.moment` , will create a global `moment` instance [Source](https://github.com/moment/moment/blob/2e2a5b35439665d4b0200143d808a7c26d6cd30f/meteor/export.js) — Ramiz Wachtler, Jul 31 '19 at 12:51
@hanshenrik ok but I just said no window object is being used. I think Ramiz Wachtler nailed it — Gianluca Ghettini, Jul 31 '19 at 12:55
Simple `var mylib = …` (in global scope) or `mylib = …` (in sloppy mode) assignments do create global variables without needing a `window` reference. — Bergi, Jul 31 '19 at 12:55
Actually, at Moment.js site you can see that global `moment` is deprecated. So, just as they do, you need to bind it manually — lucifer63, Jul 31 '19 at 13:06
@RamizWachtler tried the mylib = this.mylib and it didn't work. mylib is not visible everywhere — Gianluca Ghettini, Jul 31 '19 at 13:15
@GianlucaGhettini, just get the global (https://stackoverflow.com/questions/3277182/how-to-get-the-global-object-in-javascript) and assign your object to it — lucifer63, Jul 31 '19 at 13:19

Meiswjn · Accepted Answer · 2019-07-31T13:03:44.480

EDIT: If you specifically want to create a library, export / import should help you:

import * as myModule from '/modules/my-module.js';

Export a function in the library with the export keyword:

export function bing(Parameters here) {
alert("bong");
}

As answered in Calling a javascript function in another js file

You can only call functions from files that were loaded before and are in the same scope. If the accepted answer from the refered post doesn't work, try jQuery

$.getScript(url, function() { bläh(); });

score 0 · Answer 2 · answered Jul 31 '19 at 13:04

Ordinary I use something like this to define a separate module using ES5.

LibName= window.LibName || {};

LibName = function () {

  var yourVar1;
  var yourVar2;


  publicFunc1 = function() {

  };

  privateFunc2 = function() {

  };


  return {
    "publicFuncName" :  publicFunc1
  }

}();

With the help of ES6, you may create with class and without window variable.

class MyLib {
  constructor() {
    this.foo = 1;
    this.bar = 2;
  }

  myPublicMethod1() {
    return this.foo;
  }

  myPublicMethod2(foo) {
    return foo + this.bar;
  }
}

const instance = new MyLib();
export { instance as MyLib };

In code, you going to use it like this

import { MyLib } from './MyLib';

How can I make my JavaScript library global?

2 Answers2