Uncaught Error: Mismatched anonymous define() modu

2019-03-18 13:01发布

问题:

This question already has an answer here:

  • Mismatched anonymous define() module 6 answers

I got this error while loading the requirejs file for the backbone. I tried loading the r.js, the requirejs optimizer, but I'm still stuck with it.

Uncaught Error: Mismatched anonymous define() module: function definition(name, global){

"use strict";

var PubSub = {
        name: 'PubSubJS',
        version: '1.3.1-dev'

Following is my js:

define([
'jquery',
'underscore',
'backbone'
],function(){
subAccountRouter = Backbone.Router.extend({
  routes: {
  // Defining the routes
    'sub-accounts': 'subAccountList',
    '*actions': 'defaultAction'
  },
});

Seems there have been some changes made to requirejs define() call function, somehow cant figure it out. Does anyone have ideas??

EDIT:::

Below is the router.js file.

    define([
       'jquery',
       'underscore',
       'backbone'
      ],function($, _, Backbone){
          SubAccountRouter = Backbone.Router.extend({
              routes: {
               'sub-accounts': 'subAccountList',
               '*actions': 'defaultAction'
              },


           initialize: function () {
              this.appContainer = $("#subaccount");
    //collections and models
              this.subAccountCollection = null;
            this.subAccountModel = null;
          },

      subAccountList: function(){
        var self = this;
        },
     defaultAction: function(){
        this.subAccountList();
      },
      });

    return {
       initialize: function() {
           Backbone.history.start();

          }
        };
     }); //main func

What im i doing wrong here?? I check al my paths and they seem to be correct, i still dont get why this issue is still bugging me..:( I have tried changing the paths for the routes, and also passing arguments to the function($, _, Backbone)(as shown below in 1 of the sol'n). However i still seem to see the error. Does any one have any other ideas???

回答1:

UPDATE

After checking the docs - this is actually the first error they discuss:

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

So make sure the only <script> tag (at least for any scripts which call define()) in your index.html is the one to requirejs.

END UPDATE

You need to pass in parameters to your function() like so:

define([
'jquery',
'underscore',
'backbone'
],function(jquery, underscore, backbone){
subAccountRouter = Backbone.Router.extend({
  routes: {
  // Defining the routes
    'sub-accounts': 'subAccountList',
    '*actions': 'defaultAction'
  },
});

I wrote a super-simple post on setting up requirejs recently, if you're still stuck.



回答2:

Per the docs, require.js can blow up if:

  • You have an anonymous define ("modules that call define() with no string ID") in its own script tag (I assume actually they mean anywhere in global scope).
  • You have modules that have conflicting names.
  • You use loader plugins or anonymous modules but don't use require.js's optimizer to bundle them.

I had this problem while including bundles built with browserify alongside require.js modules. The solution was to either:

A. load the non-require.js standalone bundles in script tags before require.js is loaded, or

B. load them using require.js (instead of a script tag).