javascript - RequireJS Uncaught Error: Mismatched anonymous define() module - Stack Overflow

admin管理员组

文章数量:1344186

Using RequireJS with Backbone in a minimal app, I always get

Uncaught Error: Mismatched anonymous define() module

even though the app continues to work. Here it is: /

I'm including jQuery, underscore, backbone in index.html, since I want to shorten the define() boilerplate in each view/model.

.js consists of

 var l = console.log.bind(console)

var app
//l("AA")

require.config({
  paths: {
    // Major libraries
    /*jquery: 'libs/jquery/jquery-min',
    underscore: 'libs/underscore/underscore-min', // 
    backbone: 'libs/backbone/backbone-min', // 
*/
    // Require.js plugins
    text: 'text'

  }

})


function initApp() {
  console.log("BB")

  require([
    'views/AppView'
  ], function(AppView){
    l("CC")

    app = new AppView()
    $("#app").html(app.render())

  })
}

$(document).ready(initApp)

I cannot figure out the issue from docs or this answered question: Mismatched anonymous define() module

Thank you

Using RequireJS with Backbone in a minimal app, I always get

Uncaught Error: Mismatched anonymous define() module

even though the app continues to work. Here it is: https://assets.site44./admin/

I'm including jQuery, underscore, backbone in index.html, since I want to shorten the define() boilerplate in each view/model.

https://assets.site44./admin/js/main.js consists of

 var l = console.log.bind(console)

var app
//l("AA")

require.config({
  paths: {
    // Major libraries
    /*jquery: 'libs/jquery/jquery-min',
    underscore: 'libs/underscore/underscore-min', // https://github./amdjs
    backbone: 'libs/backbone/backbone-min', // https://github./amdjs
*/
    // Require.js plugins
    text: 'text'

  }

})


function initApp() {
  console.log("BB")

  require([
    'views/AppView'
  ], function(AppView){
    l("CC")

    app = new AppView()
    $("#app").html(app.render())

  })
}

$(document).ready(initApp)

I cannot figure out the issue from docs or this answered question: Mismatched anonymous define() module

Thank you

• javascript
• backbone.js
• requirejs

Share Improve this question Follow edited May 23, 2017 at 11:59 CommunityBot 111 silver badge asked Nov 27, 2013 at 10:04 user3036808user3036808 6311 gold badge11 silver badge33 bronze badges 3

• Your code has a lot of syntax errors, especially missing semi-colons. I'd really remend sorting those out first. Perhaps unment the paths to jQuery, Underscore and Backbone, since your code relies on them being included, and include them in your AppView and MyModel define() calls. – Simon Adcock Commented Nov 27, 2013 at 14:03
• Hi Simon, I'd like to avoid defining jQuery, Underscore and Backbone in EVERY view/model/collection. I'm not sure what syntax errors you refer to -- adding semi-colons won't make that error go away. – user3036808 Commented Dec 3, 2013 at 12:22
• You don't need to define all of them them in every view, model and collection, but you'll definitely need Backbone in all of them. You can leave out the semi-colons if you trust JavaScript's inherently unreliable automatic semi-colon insertion functionality. Not sure why you'd want to, though. It's a mon source of bugs that are difficult to track. – Simon Adcock Commented Dec 3, 2013 at 13:24

Add a ment  | 

3 Answers 3

Sorted by: Reset to default 4

I'm including jQuery, underscore, backbone in index.html, since I want to shorten the define() boilerplate in each view/model.

You shouldn't. If you google "Uncaught Error: Mismatched anonymous define() module" you'll notice the topmost link is to the FAQ of RequireJS explaining that

If you manually code a script tag in HTML to load a script with an anonymous define() call, this error can occur.

--EDIT

If you're using grunt you can use grunt-generate to easily create modules based on your own custom templates, when boilerplate overload threatens to ruin your day :)

Disclaimer: I wrote the Grunt plugin.

If you manually code a script tag in HTML to load a script with an anonymous define() call, this error can occur.

If you manually code a script tag in HTML to load a script that has a few named modules, but then try to load an anonymous module that ends up having the same name as one of the named modules in the script loaded by the manually coded script tag.

Found how to get rid of it: use require() directly, rather than inside the ready handler

var l = console.log.bind(console)

var app
//l("AA")

require.config({
  paths: {
    // Major libraries
    /*jquery: 'libs/jquery/jquery-min',
    underscore: 'libs/underscore/underscore-min', // https://github./amdjs
    backbone: 'libs/backbone/backbone-min', // https://github./amdjs
*/
    // Require.js plugins
    text: 'text'

  }

})


  require([
    'views/AppView'
  ], function(AppView){
    l("CC")

    app = new AppView()
    $("#app").html(app.render())

  })

本文标签： javascriptRequireJS Uncaught Error Mismatched anonymous define() moduleStack Overflow