Q:

Separate scripts with RequireJS

I recently worked on a web app, and i wanted to separate it into modules.
I searched and found out that RequireJs is the best for this. I read the doc, and some tutorials about it and came up with this
    requirejs.config({
    baseUrl: "js/lib",
    shim: {
        'jquery-1.12.1.min': ['jquery-1.12.1.min'],
        'materialize.min': ['materialize.min'],
        'knockout-3.4.0': ['knockout-3.4.0'],
        'pouchdb-5.3.0.min': ['pouchdb-5.3.0.min']
    },
    waitSeconds: 0,
    paths: {
        'jquery-1.12.1.min': 'jquery-1.12.1.min',
        'materialize.min': 'materialize.min',
        'knockout-3.4.0': 'knockout-3.4.0',
        'pouchdb-5.3.0.min': 'pouchdb-5.3.0.min',
    }   
});
require(["jquery-1.12.1.min", "knockout-3.4.0", "materialize.min", "pouchdb-5.3.0.min"], function($, ko) { //My main functions and other stuff ... }

My index has the following:
<script data-main="js/main" src="js/lib/require.js"></script>
 <script type="text/javascript" src="js/converter.js"></script>
But it seems that my Jquery, KO, materialize.css and pouchdb  aren't loading as i see on my chrome dev tools in Network:

I also read about the shim config how to set up the dependences and i want them in that order. I don't really know what am i missing, any help would really be appreciated.
Folder structure is:
js:  
   lib:
     ->jquery-1.12.1.min.js
     ->knockout-3.4.0.js
     ->pouchdb-5.3.0.min.js
     ->materialize.min.js 
     ->require.js 
   main.js
   converter.js

A:

Ok it seems require and materialze.css have a problem with hammer.js, what i recommend is you go and download Hammer.min.js and include it in your lib folder.
Then in your main.js add the following:
requirejs.config({
    baseUrl: 'js/lib',
    waitSeconds: 0,
    paths: {
        app: '../app',
        jquery: 'jquery-1.12.1.min',
        materialize: 'materialize.min',
        knockout: 'knockout-3.4.0',
        pouchdb: 'pouchdb-5.3.0.min',
        hammer: 'hammer.min'
    },
    shim: {
        hammer: {
            deps: ['jquery']
        },
        pouchdb: {
            deps: ['jquery']
        },
        knockout: {
            deps: ['jquery'],
            exports: 'ko'
        },
        materialize: {
            deps: ['jquery', 'hammer'],
        },
        jquery: {
            exports: '$'
        }
    }
});

You include you hammer and also the dependency for jquery on it. And i see that you didn't put the PouchDb object in the function:
define(["jquery", "knockout", "pouchdb", "materialize" ], function($, ko, PouchDB) {...
Hope this helps

