Jquery 什么'；我的RequireJS依赖链有什么问题？

我刚刚开始学习RequireJS，似乎我没有正确地表达我的依赖关系。我试图映射一个相当简单的依赖链：

KnockoutJS

取决于

jquerytmpl

取决于

jquery

我试图不使用

requirejquery

。在我的HTML中，我执行以下操作：

<script data-main="scripts/main" src="scripts/require.js"></script>

我的

需要jquery tmpl.js

：

require(
  {
    baseUrl: 'scripts',
    paths: {
        jquery: 'https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min',
        jquerytmpl: "require-jquery-tmpl",
        knockout: "require-knockout"
    }
  },
  ["myApp"],
  function() {
        $(function() {
            console.log('main: triggered');
        });
  }
);

define([
  "order!jquery",
  "order!http://ajax.aspnetcdn.com/ajax/jquery.templates/beta1/jquery.tmpl.js"], 
  function() {
    console.log("init tmpl");
  }
);

define([
  "order!jquerytmpl",
  "order!./scripts/knockout-1.2.1.js"], 
  function() {
        console.log("init ko");
  }
);

require(
  {
    baseUrl: 'scripts',
    paths: {
        jquery: 'https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min',
        jquerytmpl: "require-jquery-tmpl",
        knockout: "require-knockout"
    }
  },
  ["myApp"],
  function() {
        $(function() {
            console.log('main: triggered');
        });
  }
);

define(["jquery"], function() {
    require(["order!http://ajax.aspnetcdn.com/ajax/jquery.templates/beta1/jquery.tmpl.js"], function() {
        console.log("init tmpl");
    });
});

define(["jquerytmpl"], function() {
    require(["order!knockout-1.2.1.js"], function() {
        console.log("init ko");
    });
});

My

require knockout.js

：

require(
  {
    baseUrl: 'scripts',
    paths: {
        jquery: 'https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min',
        jquerytmpl: "require-jquery-tmpl",
        knockout: "require-knockout"
    }
  },
  ["myApp"],
  function() {
        $(function() {
            console.log('main: triggered');
        });
  }
);

define([
  "order!jquery",
  "order!http://ajax.aspnetcdn.com/ajax/jquery.templates/beta1/jquery.tmpl.js"], 
  function() {
    console.log("init tmpl");
  }
);

define([
  "order!jquerytmpl",
  "order!./scripts/knockout-1.2.1.js"], 
  function() {
        console.log("init ko");
  }
);

require(
  {
    baseUrl: 'scripts',
    paths: {
        jquery: 'https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min',
        jquerytmpl: "require-jquery-tmpl",
        knockout: "require-knockout"
    }
  },
  ["myApp"],
  function() {
        $(function() {
            console.log('main: triggered');
        });
  }
);

define(["jquery"], function() {
    require(["order!http://ajax.aspnetcdn.com/ajax/jquery.templates/beta1/jquery.tmpl.js"], function() {
        console.log("init tmpl");
    });
});

define(["jquerytmpl"], function() {
    require(["order!knockout-1.2.1.js"], function() {
        console.log("init ko");
    });
});

最后，

myApp.js

：

define(["knockout"], function() {
    $(function() { ... }
}

我看到的是，knockout-1.2.1.js在jquery-tmpl.js之前被加载和评估。

console.log

s显示

init tmpl

发生在

init ko

之前，因此RequireJS回调按正确的顺序启动。但是，我在Knockout中添加了一些调试日志，我可以看到它在

inittmpl

发生之前就已经得到了评估

因此，当我尝试

ko.applyBindings（）

时，它会抱怨找不到jQuery模板。有趣的是，如果我手动告诉KO在回调中注册默认模板引擎，它工作正常，一切都很完美。但是，我认为这只是掩盖了核心问题

---

为什么RequireJS不等待jquery tmpl加载后再评估淘汰？

您的

脚本

目录中有

order.js

文件吗

---

此外，当您还希望包含jquery时，requirejs站点将使用require-jquery.js而不是require.js。我一直使用它，没有任何问题。

我无法诊断实际问题，但我通过在模块定义的部分中使用

require

而不是

define

来实现依赖关系。适用于我的配置如下所示：

My

main.js

：

require(
  {
    baseUrl: 'scripts',
    paths: {
        jquery: 'https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min',
        jquerytmpl: "require-jquery-tmpl",
        knockout: "require-knockout"
    }
  },
  ["myApp"],
  function() {
        $(function() {
            console.log('main: triggered');
        });
  }
);

define([
  "order!jquery",
  "order!http://ajax.aspnetcdn.com/ajax/jquery.templates/beta1/jquery.tmpl.js"], 
  function() {
    console.log("init tmpl");
  }
);

define([
  "order!jquerytmpl",
  "order!./scripts/knockout-1.2.1.js"], 
  function() {
        console.log("init ko");
  }
);

require(
  {
    baseUrl: 'scripts',
    paths: {
        jquery: 'https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min',
        jquerytmpl: "require-jquery-tmpl",
        knockout: "require-knockout"
    }
  },
  ["myApp"],
  function() {
        $(function() {
            console.log('main: triggered');
        });
  }
);

define(["jquery"], function() {
    require(["order!http://ajax.aspnetcdn.com/ajax/jquery.templates/beta1/jquery.tmpl.js"], function() {
        console.log("init tmpl");
    });
});

define(["jquerytmpl"], function() {
    require(["order!knockout-1.2.1.js"], function() {
        console.log("init ko");
    });
});

我的

需要jquery tmpl.js

：

require(
  {
    baseUrl: 'scripts',
    paths: {
        jquery: 'https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min',
        jquerytmpl: "require-jquery-tmpl",
        knockout: "require-knockout"
    }
  },
  ["myApp"],
  function() {
        $(function() {
            console.log('main: triggered');
        });
  }
);

define([
  "order!jquery",
  "order!http://ajax.aspnetcdn.com/ajax/jquery.templates/beta1/jquery.tmpl.js"], 
  function() {
    console.log("init tmpl");
  }
);

define([
  "order!jquerytmpl",
  "order!./scripts/knockout-1.2.1.js"], 
  function() {
        console.log("init ko");
  }
);

require(
  {
    baseUrl: 'scripts',
    paths: {
        jquery: 'https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min',
        jquerytmpl: "require-jquery-tmpl",
        knockout: "require-knockout"
    }
  },
  ["myApp"],
  function() {
        $(function() {
            console.log('main: triggered');
        });
  }
);

define(["jquery"], function() {
    require(["order!http://ajax.aspnetcdn.com/ajax/jquery.templates/beta1/jquery.tmpl.js"], function() {
        console.log("init tmpl");
    });
});

define(["jquerytmpl"], function() {
    require(["order!knockout-1.2.1.js"], function() {
        console.log("init ko");
    });
});

注意，我说的是

require

jquery.tmpl.js和

order

，而不是在

define

依赖项中列出它

对

的相同更改需要knockout.js

：

require(
  {
    baseUrl: 'scripts',
    paths: {
        jquery: 'https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min',
        jquerytmpl: "require-jquery-tmpl",
        knockout: "require-knockout"
    }
  },
  ["myApp"],
  function() {
        $(function() {
            console.log('main: triggered');
        });
  }
);

define([
  "order!jquery",
  "order!http://ajax.aspnetcdn.com/ajax/jquery.templates/beta1/jquery.tmpl.js"], 
  function() {
    console.log("init tmpl");
  }
);

define([
  "order!jquerytmpl",
  "order!./scripts/knockout-1.2.1.js"], 
  function() {
        console.log("init ko");
  }
);

require(
  {
    baseUrl: 'scripts',
    paths: {
        jquery: 'https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min',
        jquerytmpl: "require-jquery-tmpl",
        knockout: "require-knockout"
    }
  },
  ["myApp"],
  function() {
        $(function() {
            console.log('main: triggered');
        });
  }
);

define(["jquery"], function() {
    require(["order!http://ajax.aspnetcdn.com/ajax/jquery.templates/beta1/jquery.tmpl.js"], function() {
        console.log("init tmpl");
    });
});

define(["jquerytmpl"], function() {
    require(["order!knockout-1.2.1.js"], function() {
        console.log("init ko");
    });
});

---

这解决了我的问题，但我仍然没有解释为什么

requerejs

order

插件不能正确使用我的原始定义。

是的，脚本目录中有order.js。我希望避免使用require-jquery.js方法。在我看来，它们是两个完全不同的“东西”，不应该相互捆绑在一起！只应用于require语句。