javascript - 将 require js 与 angular js 一起使用

Question

我正在尝试同时使用 require js 和 angular js。通过谷歌搜索推荐给某人指南:

• http://marcoslin.github.io/angularAMD/#/home
• http://www.sitepoint.com/using-requirejs-angularjs-applications/

两个指南似乎都使用angular，angular-route和angular-amd，但我认为它们是用于其他复杂目的，所以我只使用“angular js”(所以没有shim在 require.config() 中)。

我的 main.js 看起来像这样；

require.config({
    paths: {
        jquery      : 'https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min',
        'angular'   : 'https://ajax.googleapis.com/ajax/libs/angularjs/1.5.0/angular.min',
        'class'     : 'class',
        'utility'   : '../utility/utility',
    },

    deps: ['main1']
});

其中 deps: ['main1'] 是第一个指南使用的 require 定义后要加载的文件。

但我一直收到这个错误:

Error: $injector:modulerr

(“UpdateApp”是我在项目中使用的应用程序的名称。)

网页上说我忘记将文件包含在定义的模块中时收到错误消息。

不使用 deps: ['main1'] 但使用 require(['angular'], function(){} 并注销 angular.module ('myApp',[]) 很好地记录了对象。...似乎 require(['angular'], function(angular) 不起作用但是 require (['angular'], function() 对我有用，指南似乎没有告诉我应该做后者还是前者。

我认为这会像在 paths 中添加 angular js 一样简单，并使用 require() 或 define() 加载它会工作，但它不是...

如何简单地使用 Require JS 和 Angular JS 来打印“hello world”？

Answer 1

查看您的代码，我发现您显然误解了同时使用 requireJS 和 angular 的概念。您找到的任何一个链接都是由专业的 JS 开发人员创建的。两者都试图尽可能简单地结合 angular 和 requireJS。所以你需要接受它很复杂的事实。

=> 这就是为什么我不会尝试帮助您编写一些代码。因为这将花费大量时间，并且涉及许多主题，而这些主题不太可能适合在 stackoverflow 上的单个问题和答案中。

How do I use Require JS and Angular JS as simple as just using them together to print "hello world"?

起初我想重复一遍。这与简单的工作完全不同。对于 requireJS，您至少需要对所谓的 AMD 有深入的了解，并且能够想象当 requireJS 尝试加载 JS 库时事情是如何异步发生的。

其次，关于angular模块/服务注入(inject)的常识。由于 requireJS 和 angular 都可以进行某种模块/服务注入(inject)，因此您需要了解这两者之间的区别。

第三，你的webapp的初始阶段。由于 requireJS 和 angular 都需要初始化才能正常运行。所以这也是要求。

总结

您将无法在一两天内理解两者。需要花时间。但幸运的是，我有几个建议给你。

• 研究一些关于 requireJS 和 angular 如何加载它们的依赖项。
• 前往 angularAMD 获取项目种子。设置、运行、使用它。
• 提高您对两者初始状态的了解。
• ...
• 利润!

P.S. 仅供引用。一年前，我开始使用 requireJS 和 angular。和你一样，我遇到了一大堆知识墙。这些就是我试图理解的。慢慢来，它不像使用jquery 那样一两天就能学会。即使对于一些 JS 专家来说，他们也需要几个月的时间才能对 Angular 充满信心(不算将它与 requireJS 结合使用)。干杯!