admin管理员组

文章数量:1313800

Now I know this question has been asked a million times before, but I still couldn't figure it out.

I have a huge amount of "defines" in various files. Most the time, this works, but a few of my modules are "not loaded for context" sometimes, even-though I put their names in the "define" statement.

===========================

Current Code

index.js (Simplified for StackOverflow)

require.config({
    baseUrl: '',
    paths: { 
    //TOOLS
        jquery: '../libraries/jquery-1.10.2.min',
        socketio:'socket.io/socket.io',
        jqueryLightBox:'../libraries/jquery.lightbox_me',
        jqueryMigrate:'../libraries/jquery-migrate-1.2.1',
        jqueryUI:'../libraries/jquery-ui-1.10.3.custom.min',
        spinner:'../libraries/jquery.spin',
        jQueryFormPlugin:'../libraries/jquery.form.min',
        jQueryCookiePlugin:'../libraries/jquery.cookie',
        json2:'../libraries/json2', 
        raphael:'../libraries/raphael-min', 
        raphaelPanZoom:'../libraries/raphael.pan-zoom.min',
        bootstrap: '../libraries/bootstrap.min',
        browserDetection: '../libraries/BrowserDetect',
        qtip: '../libraries/jquery.qtip.min',
        imagesloaded: '../libraries/imagesloaded.pkgd.min', 
        eventie: '../libraries/eventie',
        eventEmitter: '../libraries/EventEmitter.min',
        underscore: '../libraries/underscore-min',
        underscoreString: '../libraries/underscore.string.min',
        stacktrace: '../libraries/stacktrace',
        elapseMeMin: '../libraries/elapseMe.min',
        jqueryKeithWood: '../libraries/jquery.svg.min', 
        domReady: '../libraries/domReady',
    //PAGES: (Simplified for StackOverflow)
        TestView: '../javascripts/tests/TestView',
        TestModel: '../javascripts/tests/TestModel',
        TestController: '../javascripts/tests/TestController',
        TestPanelView: '../javascripts/tests/Test-StartPanelView',
        SocketLogic: '../javascripts/SocketLogic',
        Logger: '../javascripts/Logger',

    }, 
    shim: {
    'socketio': {
      exports: 'io'
                },
     'spinner': {
      exports: 'Spinner',
      deps: ['jquery']
                },
    'raphael':  {
     exports: 'Raphael',
      deps: ['jquery']
                },
    'raphaelPanZoom': {
      deps: ['raphael']
            },
    'bootstrap': {},
    'browserDetection':  {
      exports: 'BrowserDetect'
            },
    'underscore': {
      exports: '_'
                },
    'underscoreString': {
      deps: ['underscore'],
      exports: '_'
        },
     'stacktrace': {
      exports: 'printStackTrace'
        },
     'elapseMeMin': {
         exports: 'elapseMe',
         deps: ['jquery']
        }

    }
});

//////////////////
//1) Everything starts with this method. Will execute when the DOM is ready.
/////////////////

require(['domReady'], function (domReady) {
  domReady(function () {
    //This function is called once the DOM is ready.
    //It will be safe to query the DOM and manipulate
    //DOM nodes in this function.
    //Start Loading!
    require(['TestController'], function(TestController)
    {
        TestController.firstMethod();
    }); 
  });
});

TestController.js (Simplified for StackOverflow)

define(['TestModel', 'TestView', 'SocketLogic', 'Logger', 'TestPanelView'], 
function (TestModel, TestView, socketLogic, Logger, TestPanelView) 
{
 return {
    firstMethod: function()
    {
             TestModel.doSomething();
             TestView.doSomethingElse();
             socketLogic.andAnother();
             Logger.log("hi");
             TestPanelView.updateSomething();
             this.anotherMethod();
    },
    anotherMethod: function()
    {
             console.log("hello");
    }
    }
});

===========================

Problem

But, once in a while, I'll randomly get just one of them to "not be loaded for context", eventhough the rest were just fine:

Uncaught Error: Module name "TestPanelView" has not been loaded yet for context: _
.html#notloaded 

===========================

Current Fixes

Fix #1 - Using require('');

Instead of

TestPanelView.updateSomething();

I have been doing:

var testPanelView = require('TestPanelView');
testPanelView.updateSomething();

Which works, BUT.. shouldn't it have already been loaded into context since I put it in the header? Why this one? It's the same as all the others!

Fix #2 - Using require([''],function(){});

This also works, but again I'm just doing this one by one and it feels wrong!

Instead of

TestPanelView.updateSomething();

Sometimes I do this:

require(['TestPanelView'], function(testPanelView){
      testPanelView.updateSomething();
});

Failed Attempts #1

TestController.js (Simplified for StackOverflow)

define(['require', 'TestModel', 'TestView', 'SocketLogic', 'Logger', 'TestPanelView'], 
function (require) 
{
var TestModel = require('TestModel')
var TestView = require('TestView');
var SocketLogic = require('SocketLogic');
var Logger = require('Logger');
var TestPanelView = require('TestPanelView');
 return {
    firstMethod: function()
    {
             TestModel.doSomething();
             TestView.doSomethingElse();
             SocketLogic.andAnother();
             Logger.log("hi");
             TestPanelView.updateSomething();
             this.anotherMethod();
    },
    anotherMethod: function()
    {
             console.log("hello");
    }
    }
});

Here I get the "not loaded for context" error again, but this time for all of them.

===========================

Ideas?

I've been manually patching each one that I find like this, which is not happening to all, only some here and there, which feels like monkey patching... I'd like to know what I'm doing wrong here :( Anyone know?

Note: I'm using RequireJS v.2.1.10

Now I know this question has been asked a million times before, but I still couldn't figure it out.

I have a huge amount of "defines" in various files. Most the time, this works, but a few of my modules are "not loaded for context" sometimes, even-though I put their names in the "define" statement.

===========================

Current Code

index.js (Simplified for StackOverflow)

require.config({
    baseUrl: '',
    paths: { 
    //TOOLS
        jquery: '../libraries/jquery-1.10.2.min',
        socketio:'socket.io/socket.io',
        jqueryLightBox:'../libraries/jquery.lightbox_me',
        jqueryMigrate:'../libraries/jquery-migrate-1.2.1',
        jqueryUI:'../libraries/jquery-ui-1.10.3.custom.min',
        spinner:'../libraries/jquery.spin',
        jQueryFormPlugin:'../libraries/jquery.form.min',
        jQueryCookiePlugin:'../libraries/jquery.cookie',
        json2:'../libraries/json2', 
        raphael:'../libraries/raphael-min', 
        raphaelPanZoom:'../libraries/raphael.pan-zoom.min',
        bootstrap: '../libraries/bootstrap.min',
        browserDetection: '../libraries/BrowserDetect',
        qtip: '../libraries/jquery.qtip.min',
        imagesloaded: '../libraries/imagesloaded.pkgd.min', 
        eventie: '../libraries/eventie',
        eventEmitter: '../libraries/EventEmitter.min',
        underscore: '../libraries/underscore-min',
        underscoreString: '../libraries/underscore.string.min',
        stacktrace: '../libraries/stacktrace',
        elapseMeMin: '../libraries/elapseMe.min',
        jqueryKeithWood: '../libraries/jquery.svg.min', 
        domReady: '../libraries/domReady',
    //PAGES: (Simplified for StackOverflow)
        TestView: '../javascripts/tests/TestView',
        TestModel: '../javascripts/tests/TestModel',
        TestController: '../javascripts/tests/TestController',
        TestPanelView: '../javascripts/tests/Test-StartPanelView',
        SocketLogic: '../javascripts/SocketLogic',
        Logger: '../javascripts/Logger',

    }, 
    shim: {
    'socketio': {
      exports: 'io'
                },
     'spinner': {
      exports: 'Spinner',
      deps: ['jquery']
                },
    'raphael':  {
     exports: 'Raphael',
      deps: ['jquery']
                },
    'raphaelPanZoom': {
      deps: ['raphael']
            },
    'bootstrap': {},
    'browserDetection':  {
      exports: 'BrowserDetect'
            },
    'underscore': {
      exports: '_'
                },
    'underscoreString': {
      deps: ['underscore'],
      exports: '_'
        },
     'stacktrace': {
      exports: 'printStackTrace'
        },
     'elapseMeMin': {
         exports: 'elapseMe',
         deps: ['jquery']
        }

    }
});

//////////////////
//1) Everything starts with this method. Will execute when the DOM is ready.
/////////////////

require(['domReady'], function (domReady) {
  domReady(function () {
    //This function is called once the DOM is ready.
    //It will be safe to query the DOM and manipulate
    //DOM nodes in this function.
    //Start Loading!
    require(['TestController'], function(TestController)
    {
        TestController.firstMethod();
    }); 
  });
});

TestController.js (Simplified for StackOverflow)

define(['TestModel', 'TestView', 'SocketLogic', 'Logger', 'TestPanelView'], 
function (TestModel, TestView, socketLogic, Logger, TestPanelView) 
{
 return {
    firstMethod: function()
    {
             TestModel.doSomething();
             TestView.doSomethingElse();
             socketLogic.andAnother();
             Logger.log("hi");
             TestPanelView.updateSomething();
             this.anotherMethod();
    },
    anotherMethod: function()
    {
             console.log("hello");
    }
    }
});

===========================

Problem

But, once in a while, I'll randomly get just one of them to "not be loaded for context", eventhough the rest were just fine:

Uncaught Error: Module name "TestPanelView" has not been loaded yet for context: _
http://requirejs/docs/errors.html#notloaded 

===========================

Current Fixes

Fix #1 - Using require('');

Instead of

TestPanelView.updateSomething();

I have been doing:

var testPanelView = require('TestPanelView');
testPanelView.updateSomething();

Which works, BUT.. shouldn't it have already been loaded into context since I put it in the header? Why this one? It's the same as all the others!

Fix #2 - Using require([''],function(){});

This also works, but again I'm just doing this one by one and it feels wrong!

Instead of

TestPanelView.updateSomething();

Sometimes I do this:

require(['TestPanelView'], function(testPanelView){
      testPanelView.updateSomething();
});

Failed Attempts #1

TestController.js (Simplified for StackOverflow)

define(['require', 'TestModel', 'TestView', 'SocketLogic', 'Logger', 'TestPanelView'], 
function (require) 
{
var TestModel = require('TestModel')
var TestView = require('TestView');
var SocketLogic = require('SocketLogic');
var Logger = require('Logger');
var TestPanelView = require('TestPanelView');
 return {
    firstMethod: function()
    {
             TestModel.doSomething();
             TestView.doSomethingElse();
             SocketLogic.andAnother();
             Logger.log("hi");
             TestPanelView.updateSomething();
             this.anotherMethod();
    },
    anotherMethod: function()
    {
             console.log("hello");
    }
    }
});

Here I get the "not loaded for context" error again, but this time for all of them.

===========================

Ideas?

I've been manually patching each one that I find like this, which is not happening to all, only some here and there, which feels like monkey patching... I'd like to know what I'm doing wrong here :( Anyone know?

Note: I'm using RequireJS v.2.1.10

• javascript
• requirejs
• amd
• js-amd

Share Improve this question Follow edited Jan 29, 2014 at 1:41 Katie asked Jan 29, 2014 at 1:36 KatieKatie 48.3k1919 gold badges102102 silver badges129129 bronze badges 2

• 2 There's nothing in the code shown in the question which explains why you'd get "... has not been loaded yet for context". I've read the code of RequireJS and see that the only kind of situation in which this error is raised is if a call like var foo = require("...") (that is, a require call with a single string argument) occurs before the module required is loaded. – Louis Commented Jan 30, 2014 at 0:41
• huh. Well that's lame :( I always make sure to have the module in the header if I'm using require("blah") in the code, I've double and triple checked all my files :( idk what it is – Katie Commented Jan 30, 2014 at 1:09

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 3

Answer to failed attempt #1

define(['require', 'TestModel', 'TestView', 'SocketLogic', 'Logger', 'TestPanelView'], 
function (require, testModel, testView, socketLogic, logger, testPanelView) {
    var firstMethod = function() {
             testModel.doSomething();
             testView.doSomethingElse();
             socketLogic.andAnother();
             logger.log("hi");
             testPanelView.updateSomething();
             this.anotherMethod();
    };
    var anotherMethod = function(){
        console.log("hello");
    }
 return {
    firstMethod: firstMethod,
    anotherMethod: anotherMethod
});

And don't forget, the opening curly bracket must e after the ending round bracket of the function in the same line.

本文标签：