I am developing a custom theme for Magento 2.1.x which should use the LightGallery jQuery plugin. I tried to include the plugin script but I am getting error.

This is my require-config.js placed under the folder app/design/frontend/Vendor/Theme/require-config.js:

var config = {
    "map" : {
        "*" : {
            custom: "js/custom.js",
            lightgallery : "js/lightgallery"

the lightgallery.js I downloaded is under the folder app/designfrontend/Vendor/Theme/web/js/lightgallery.js

Then I wrote a custom custom.js:

    function($) {

and eventually I created a phtml file included in every block which requires the custom.js module in this way:

require(['jquery', 'lorante'], function($)

Refreshing the page, after having ran the command bin/magento setup:static-content:deploy, throws javascript error:

Uncaught Error: Mismatched anonymous define() module: function (a0) {
  return (factory(a0));

What am I doing wrong?


Taking a look at the lightgallery script I noticed that it is slightly different from other jQuery plugin, such as slick for example which I can include without errors:

this is the lightgallery script:

(function (root, factory) {
  if (typeof define === 'function' && define.amd) {
    // AMD. Register as an anonymous module unless amdModuleId is set
    define(['jquery'], function (a0) {
      return (factory(a0));
  } else if (typeof exports === 'object') {
    // Node. Does not work with strict CommonJS, but
    // only CommonJS-like environments that support module.exports,
    // like Node.
    module.exports = factory(require('jquery'));
  } else {
}(this, function ($) {

This is slick:

(function(factory) {
    'use strict';
    if (typeof define === 'function' && define.amd) {
        define(['jquery'], factory);
    } else if (typeof exports !== 'undefined') {
        module.exports = factory(require('jquery'));
    } else {

}(function($) {

What are the differences between this two declarations?

  • Thanks, but I could not find any hints on what I am doing wrong. Could you elaborate? – gianis6 Aug 11 '17 at 14:22
  • If I use require instead of define I get it working but only if I remove from require array the lightgallery – gianis6 Aug 11 '17 at 14:56

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Browse other questions tagged or ask your own question.