thlorenz / browserify-shim

📩 Makes CommonJS incompatible files browserifyable.
MIT License
933 stars 87 forks source link

This Browserify-shim set-up not working with jquery-Mustache, why? #190

Closed antonioOrtiz closed 8 years ago

antonioOrtiz commented 8 years ago

The following setup gets a jQuery plugin mixitup working perfectly.

"browser": {
        "mixitup": "./app/bower_components/mixitup/src/jquery.mixitup.js",
        "jquerymustache": "./app/bower_components/jquery-Mustache/src/jquery.mustache.js"
    },
    "browserify": {
        "transform": [
            "browserify-shim"
        ]
    },
    "browserify-shim": {
        "mixitup": {
            "exports": "mixitup",
            "depends": [
                "jquery:jQuery"
            ]
        },
        "jquerymustache": {
            "exports": "Jquerymustache",
            "depends": [
                "jquery:jQuery",
                "mustache:mustache"
            ]
        }
    },

However, when I try to apply the same convention to jquery-Mustache, I am not able to get my templates fetch:

 "browser": {
   "jquerymustache": "./app/bower_components/jquery-Mustache/src/jquery.mustache.js"
  }

and

"jquerymustache": {
      "exports": "Jquerymustache",
      "depends": [
        "jquery:jQuery",
        "mustache:mustache"
      ]
    }

I don't get an error from the terminal, (that would prove the package.json setup is kosher) but I do get this error from the console:

enter image description here

Which points to this:

enter image description here

This is my app.js file, feel this is the most relevant information:

var $ = jQuery = require('jquery');
var mixitup = require('mixitup');
var Jquerymustache = require('jquerymustache');
var mustache = require('mustache');

And the function which is fetching the template.

function templateLoader(e) {
        var doc = document,
            event = EventUtility.getEvent(e),
            target = EventUtility.getTarget(event);
        $.Mustache.options.warnOnMissingTemplates = true;

        $.Mustache.load('templates/index.html')
            .fail(function() {
                $('#overlay').append('Failed to load templates from <code>templates.htm</code>');
            })
            .done(function() {
                var output = $('#overlay');
                $('body').mustache('templateID');
            });
    }

And the file path for good measure, to prove the path in the function is correct:

enter image description here

bendrucker commented 8 years ago

I can't see anything that points to this being related to browserify-shim. The plugin is loaded and running properly but whatever you have serving your templates 404s. Can't see how b-shim could possibly be involved there.