Does not appear to work with RequireJS and marked

[sixlettervariables]

I'm integrating RequireJS into my workflow (which seems to be a bad idea), and it appears bootstrap-markdown fails to find/work with chjj/marked:

//config.js
requirejs.config(
  shim: {
    "marked": {
      exports: "marked"
    },
    "bootstrap": {
      deps: ["jquery"],
      exports: "$.fn.popover"
    },
    "bootstrap-markdown": {
      deps: ["jquery", "marked"],
      exports: "$.fn.markdown"
    }
  },
  baseUrl: "/public/js",
  paths: {
    bootstrap: "../components/bootstrap/dist/js/bootstrap.min",
    "bootstrap-markdown": "../components/bootstrap-markdown/js/bootstrap-markdown",
    jquery: "../components/jquery/dist/jquery",
    marked: "../components/marked/lib/marked",
    requirejs: "../components/requirejs/require",
  }
});

The page itself requires everything in the right order:

require(['config'], function (config) {
  require(['jquery', 'bootstrap', 'marked', 'bootstrap-markdown'],
    function ($, _a, marked, _c) {
      $(document).ready(function () {
        $('textarea.use-md').markdown();
      });
    });
});

Watching some custom logging I've added to RequireJS, I see that marked is loaded prior to bootstrap-markdown, and that it appears to call the required AMD setup as well. If I fake it out with a window.marked = marked call prior to using bootstrap-markdown, everything works again.

Does bootstrap-markdown not use marked in an AMD friendly fashion?

[rommsen]

No it does not. It uses the marked function as a global variable. Thats why your workaround with window.marked is working.

I managed to get it to work with the onPreview Callback.

define(['jquery', 'marked', 'bootstrap.markdown'],
    function ($, marked) {
        'use strict';

        $('#myinput').markdown({
                    onPreview: function(e) {
                        var previewContent = e.getContent();
                        if (e.isDirty()) {
                            previewContent = marked(previewContent);
                        }
                        return previewContent;
                    }
                });
    });

Note: marked is used solely within my requirejs define. Not in bootstrap-markdown.

Cheers,

Ro

[sixlettervariables]

@rommsen thanks! I ended up rolling my own instead of using bootstrap-markdown. However, your approach seems on face value to handle this just fine. I'm going to close this issue as it no longer applies in my case and your fix should work for future users.