Search code examples
javascriptrequirejspnotify

Impossible to include PNotify with requirejs


So, I export PNotify from bower to the js folder. I use requirejs to include my libraries

HTML

<script data-main="assets/js/app" type="text/javascript" src="assets/js/lib/require.js"></script>

My architecture is like this :

js
--- app.js
--- lib
------ pnotify.core.js
------ pnotify.desktop.js
------ pnotify.buttons.js
------ pnotify.callbacks.js
------ pnotify.confirm.js
------ pnotify.history.js
------ pnotify.nonblock.js
------ pnotify.reference.js
------ jquery.js
------ ...

I add the primary module which is pnotify.core

APP.JS

requirejs.config({
    base: '/assets/js',
    paths: {
        'jQuery': 'lib/jquery.min',
        'underscore': 'lib/underscore-min',
        'Backbone': 'lib/backbone',
        'Modernizr' : 'lib/modernizr',
        'PNotify' : 'lib/pnotify.core',
        'LoginView' : 'views/login'
    },
    shim: {
        'jQuery': {
            exports: '$'
        },
        'underscore': {
            exports: '_'
        },
        'Backbone': {
            exports: 'Backbone'
        },
        'Modernizr': {
            exports: 'Modernizr'
        },
        'LoginView': {
            exports: 'LoginView'
        },
        'PNotify': {
            exports: 'PNotify'
        }
    }
});

PNotify is loaded in my page. Normally, PNotify works with requirejs : https://github.com/sciactive/pnotify#using-pnotify-with-requirejs

I don't know how can I import all modules, maybe concat these modules in one file pnotify.min.js?

Here, when I call the PNotify object under the requirejs.config

define(['jQuery', 'underscore', 'Backbone', 'Modernizr', 'LoginView', 'PNotify'], function ($, _, Backbone, Modernizr, LoginView, PNotify) {
    $(document).ready(function(){ 
        new PNotify({
            title: 'Desktop Notice',
            text: 'If you\'ve given me permission, I\'ll appear as a desktop notification. If you haven\'t, I\'ll still appear as a regular PNotify notice.'
        });
    });
});

I have this error : Uncaught TypeError: undefined is not a function on the line "new PNotify"...

Do you have some ideas?


Solution

  • When they detect AMD/RequireJS, PNotify core defines the named module "pnotify", and PNotify's modules each define names like "pnotify.module". The following example shows the use of the nonblock and desktop modules with RequireJS.

    So my error is here

    requirejs.config({
        base: '/assets/js',
        paths: {
            'jQuery': 'lib/jquery.min',
            'underscore': 'lib/underscore-min',
            'Backbone': 'lib/backbone',
            'Modernizr' : 'lib/modernizr',
            'PNotify' : 'lib/pnotify.core',
                ^_____ 'replace by pnotify'
            'LoginView' : 'views/login'
        },
        ...