Can't load Backbone.DOMStorage using require keyword

Question

I need some help because i'm fairly new to javascript and nodejs world and i'm stuck..

I have a nodejs app project where I installed dependencies (npm install) and then in my .js file, I load my modules like : var Backbone = require('backbone') and it works well.

But then i tried to install Backbone.DOMStorage (https://github.com/mikeedwards/Backbone.DOMStorage) module...

I did npm install https://github.com/mikeedwards/Backbone.DOMStorageand installation was Ok (js file is present in the node_modules folder), but when I try to load it with require('Backbone.DOMStorage') it failed to find and load the module...

From what I understood after many searches, it seems that the plugin isn't CommonJS compliant..

So how can I transform this script to be able to use it like any other module ??

Thanks !

V.S.V · Answer 1 · 2016-10-24T19:46:53.233

I will show you 4 ways do what you want.

First way

Its a js plugin that's why you need to add it to your HTML page like this. Include Backbone.domStorage after having included Backbone.js:

<script type="text/javascript" src="backbone.js"></script>
<script type="text/javascript" src="backbone.domStorage.js"></script>

and use it like this

window.SomeCollection = Backbone.Collection.extend({

    localStorage: new Backbone.LocalStorage("SomeLocalCollection"), // Unique name within your app.

    // ... everything else is normal.

});

Second way If you're using browserify.

Install using npm install backbone.localstorage, and require the module.

Backbone.LocalStorage = require("backbone.localstorage");

third way

RequireJS

Include RequireJS:

<script type="text/javascript" src="lib/require.js"></script>

RequireJS config:

require.config({
    paths: {
        jquery: "lib/jquery",
        underscore: "lib/underscore",
        backbone: "lib/backbone",
        localstorage: "lib/backbone.localStorage"
    }
});

Define your collection as a module:

define("SomeCollection", ["localstorage"], function() {
    var SomeCollection = Backbone.Collection.extend({
        localStorage: new Backbone.LocalStorage("SomeCollection") // Unique name within your app.
    });

    return SomeCollection;
});

Require your collection:

require(["SomeCollection"], function(SomeCollection) {
  // ready to use SomeCollection
});

forth way

Download js file from GitHub and put it to your library files directory after require it us js file like this

var domStorage = requier('yourLibPath/backbone.domStorage.js');

Thanks for your response, but i'm using browserify to bundle everything in a single file (app.js). First solution is not possible. Second solution could be good, but it doesn't work with `backbone.domStorage`. It works with `backbone.localstorage` but i need session storage which isn't supported. Third way, not possible, i don't want to use requireJs. How can i make it works with 2nd solution ?? — LoSTxMiND, Oct 24 '16 at 19:16
Just download backbone.domStorage.js and require it like this var domStorage = requier('path to your lib files/ backbone.domStorage.js') ; — V.S.V, Oct 24 '16 at 19:44
I already tried the fourth way and it doesn't work because the code isn't not CommonJs compliant. I think i will try one of these solutions http://stackoverflow.com/questions/5171213/load-vanilla-javascript-libraries-into-node-js?rq=1 — LoSTxMiND, Oct 24 '16 at 20:17

Can't load Backbone.DOMStorage using require keyword

1 Answers1