问题：

RequireJs 加载模块 - Qunit

郭思聪

2023-03-14

我对RequireJS非常陌生，在编写QUnit到源代码时遇到了困难，源代码具有使用RequireJS动态加载模块的逻辑。

下面是源代码:factory/Factory.js *

getPage: function (callback) {

    //doSomething here

    require(['page/something'], function() {

         callback();

    })
}

运行 QUnit 时，模块“page/something”永远不会加载，并且永远不会调用回调。我在这里错过了什么吗？感谢您的回复。

**QUnit工厂/FactoryTests.js*

define(['underscore', 'factory/Factory'],
       function (_, Factory) {

           module("Factory", {
               setup:function () {
               },
               teardown:function () {
               }
           });

           test("GetPage", function () {
              var isCallbackInvoked = false;
              var mockCallback = function () {
                  isCallbackInvoked = true;
              }

              Factory.getPage(mockCallback);
              ok(isCallbackInvoked);

           });

});

*test-require-config.js**

require.config({

    baseUrl: "../../resources/js",

    paths:{
        jquery:'../jquery-1.8.2',
    jquery_star_rating : '../jquery/jquery.rating',
        underscore:'..underscore-1.4.1',
        backbone:'../backbone-0.9.2',
        jquery_star_rating : '../jquery.rating',
        text : '../require-text-2.0.3',
        sinon: '../../../../sinon',
    },
    shim:{
        underscore:{
            exports:'_'
        },
        backbone:{
            deps:["jquery", "underscore"],
            exports:"Backbone"
        }
        jquery_star_rating : {
            deps : ['jquery']
        }
    }

});

var dependencies = [
    'jquery',
    'jquery_star_rating',
    'underscore',
    'backbone',       
    'sinon',
];

require(dependencies, function () {

    require(['../../../../test/js/testsuite'], function(suite){

    })

});

testsuite.js

function () {

    QUnit.config.autostart = false;

    var testModules = [       
        "factory/FactoryTests.js"
    ];

    require(testModules, QUnit.start);
}());

谢谢！！

共有3个答案

魏风华

2023-03-14

你可以这样做：

    <!DOCTYPE html>
<html>
<head>
    <title>Example Test Runner</title>
    <link rel="stylesheet" href="//code.jquery.com/qunit/qunit-1.15.0.css">
    <script src="../libraries/qunit/qunit/qunit.js" data-main="testsuite.js"></script>
    <script>
        QUnit.config.autostart = false;
    </script>
    <!-- Load RequireJS & the testsuite -->
    <script src="../libraries/requirejs/require.js" data-main="testsuite.js"></script>
</head>
<body>
<div id="qunit"></div>
</body>
</html>

因此，requirejs将在将选项设置为QUnit后开始工作。

颛孙国源

2023-03-14

我今天已经解决了这个问题，我正在将我收集的信息添加到@keithjGrant正确答案中。

库奈特

尽管 QUnit 在作为异步模块加载时遇到了问题，但您可以通过在 require 之前将其包含在脚本标记中.js，然后关闭自动启动，然后在加载带有测试的模块后手动调用 start（）来使其正常工作。但是，需要从计时器内部调用 start。这是完整的安全带。

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>QUnit Test Suite</title>
    <link rel="stylesheet" href="qunit-git.css">
    <script data-main="main" type="text/javascript" src="libs/require.js"></script>
    <script src="libs/qunit-git.js"></script>
    <script type="text/javascript">
        window.addEventListener("load", function onLoad() {
            QUnit.config.autostart = false;
                        // Without this setTimeout, the specs don't always get execute in webKit browsers

            setTimeout(function () {
                                //load tests using require
                require(['firstUse/example_test'], function (one) {
                    //now trigger them.
                    QUnit.start();
                });

            }, 10);
            window.removeEventListener("load", onLoad, true);
        }, true);
    </script>
</head>
<body>
    <div id="qunit">
    </div>
</body>
</html>

如果您需要停止测试，请使用 Qunit.stop（），做一些异步工作，然后使用 QUnit.start（）再次启动它们。

Unit.load = function() {
  ...

  if ( config.autostart ) {
    QUnit.start();
  }
};

if ( defined.document ) {
   addEvent( window, "load", QUnit.load );
}

我已经调查了为什么使用我不同的方法调用QUnit和RequireJs不起作用。我找到了相同的解决方案，@keithjgrant建议。

调试我的代码时，它调用了QUnit的需求Js，它似乎窗口加载事件已经被调度。document.readyState是'完成'。由于加载事件的addEventHandler的行为不像一个promise，将处理程序添加到已经触发的事件不会触发处理程序。

显式调用 QUnit.load 函数，修复了我的问题。需要考虑如何在该调用点查找窗口是否已完成加载。你可以使用JQquery，或者使用我从中获取 document.readyState == 'complete' 的 JQuery 代码的一部分来执行此操作。

羊新翰

2023-03-14

首先，澄清一下：您的QUnit测试页面是什么样子的？我猜它要么列出了零个测试，要么是一个空白页。

如果是这样的话，我也有很多麻烦。“正确”的答案正是你正在做的。但是，在我的设置中，经过大量的单步代码之后，尽管设置了＜code＞QUnit.config，但QUnit仍然在定义任何测试之前启动。autostart=false。

在 testuite.js结束时，尝试调用 QUnit.load（） 而不是 QUnit.start（） （你也可以放弃 autostart = false）。这是一个未记录的功能，但它是唯一对我有用的东西。我相信这是QUnit默认附加到onLoad事件的函数。不幸的是，使用 RequireJS，onLoad 会在大多数 js 文件加载之前触发。

类似资料：

用RequireJS延迟加载AngularJS模块

问题内容：感谢Dan Wahlin的精彩文章，我设法实现了Angular的控制器和服务的延迟加载。但是，似乎没有一种干净的方法来懒惰加载独立的模块。为了更好地解释我的问题，假设我有一个没有RequireJS的应用，其结构如下：这是在Plunker中带有RequireJS的示例应用程序：http ://plnkr.co/aiarzVpMJchYPjFRrkwn 问题的核心是Angular不允许
第三章：模块加载系统（requirejs）

任何一门语言在大规模应用阶段，必然要经历拆分模块的过程。便于维护与团队协作，与java走的最近的dojo率先引入加载器，早期的加载器都是同步的，使用document.write与同步Ajax请求实现。后来dojo开始以JSONP的方法设计它的每个模块结构。以script节点为主体加载它的模块。这个就是目前主流的加载器方式。不得不提的是，dojo的加载器与AMD规范的发明者都是james Burk
使用RequireJS库加载JavaScript模块的实例教程

本文向大家介绍使用RequireJS库加载JavaScript模块的实例教程，包括了使用RequireJS库加载JavaScript模块的实例教程的使用技巧和注意事项，需要的朋友参考一下 js通过script标签的默认加载方式是同步的，即第一个script标签内的js加载完成后，才开始加载第二个，以此类推，直至js文件全部加载完毕。且js的依赖关系必须通过script的顺序才能确保；而在js加载期
模块 - 延迟加载模块

为了显示这种关系，让我们开始定义一个简单的模块，作为我们的示例应用程序的根模块。 app/app.module.ts 到目前为止，这是一个非常常见的模块，依赖于，有一个路由机制和两个组件：AppComponent和EagerComponent。现在，让我们专注于定义导航的应用程序（AppComponent）的根组件。 app/app.component.ts import { Component
模块的加载

不管是用import还是用from mmmm import *的方式导入模块，当程序运行之后，回头在看那个存储着mmmm.py文件的目录中（关于mmmm.py文件可以看上一讲），多了一个文件: qw@qw-Latitude-E4300:~/Documents/ITArticles/BasicPython/codes$ ls mmm* mmmm.py mmmm.pyc 在这个目录下面，除了原来的
模块加载器

模块是存在远程服务器上的，因此需要一个特殊的加载器来加载这些已经定义好的模块。目前，根据模块化规范，对应的模块加载器有： CMD 直接执行：coolie.js 直接执行：Sea.js 链接：如何实现一个 CMD 模块加载器 sea.js 与 RequireJS 的异同 AMD 直接执行：RequireJS。链接： Javascript模块化编程（一）：模块的写法 Javascript模块化编

RequireJs 加载模块 - Qunit

共有3个答案

相关问答

相关文章

相关阅读

相关工具

相关文档