Requirejs 幻影与需求_Requirejs_Phantomjs

Requirejs 幻影与需求

requirejs phantomjs

Requirejs 幻影与需求,requirejs,phantomjs,Requirejs,Phantomjs,main.js文件中的代码如下： phantom.injectJs("libs/require-1.0.7.js"); require.config( { baseUrl: "" } ); require([], function(){}); 当我在命令行中运行“phantomjs main.js”时，requirejs在main.js中工作不好。我知道如何在浏览器中运行的页面中使用requi

main.js文件中的代码如下：

      phantom.injectJs("libs/require-1.0.7.js");
      require.config(
        {
          baseUrl: "" 
        }
      );
      require([], function(){});

当我在命令行中运行“phantomjs main.js”时，requirejs在main.js中工作不好。我知道如何在浏览器中运行的页面中使用requirejs（包括phantomjs的方式：page.open（url，callback）），但不像上面那样。我试着像main.js一样使用requirejs，我认为这是一个流行的问题。谢谢大家!

你误解了网页。js（）

它用于将脚本注入正在加载的页面，而不是注入phantomjs运行时环境

因此，使用.injectJs（）会使requirejs加载到您的页面中，而不是加载到phantomjs.exe中

也就是说，phantomjs的运行时环境近似于commonjs。默认情况下，RequireJs不会在那里运行。如果您感到特别（非常）有动力，您可以尝试移植为nodejs制作的require shim，但它不是开箱即用的，需要对运行时有非常深刻的理解。有关详细信息：

更好的主意：

也许您应该确保您有想要运行的javascript的commonjs版本。我个人用typescript编写代码，这样我就可以为commonjs或amd构建代码。我对phantomjs代码使用commonjs，对nodejs和浏览器使用amd。

我只是挣扎了一段时间。我的解决方案不是干净的，但它可以工作，我很高兴这是因为phantomjs中未完成的api文档

冗长的解释你需要三个文件。一个是你的amd phantomjs测试文件，我称之为“amd.js”。第二个是要加载的html页面，我将其命名为“amd.html”。最后是浏览器测试，我称之为“amdTestModule.js”

在amd.html中，根据标准声明脚本标记：

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

现在，由于requirejs异步加载文件，我们不能只是将回调传递到page.open中，然后期望事情顺利进行。我们需要某种方法来 1）在浏览器中测试我们的模块，并将结果反馈给我们的phantomjs上下文。或
2）告诉我们的phantomjs上下文，在加载所有资源后，运行测试

#我的情况更简单。我通过以下方式实现了这一点：

page.onConsoleMessage = function(msg) {
    msg = msg.split('=');
    if (msg[1] === 'success') {
        console.log('amd test successful');
    } else {
        console.log('amd test failed');
    }
    phantom.exit();
};

**有关my console.log消息，请参阅下面的完整代码

现在phantomjs显然内置了一个事件api，但它没有文档记录。我还成功地从他们的page.onResourceReceived和page.onResourceRequested中获取请求/响应消息，这意味着您可以在加载所有所需模块时进行调试。然而，为了传达我的测试结果，我只使用了console.log

现在，如果console.log消息从未运行，会发生什么？解决这个问题的唯一方法是使用setTimeout

setTimeout(function() {
    console.log('amd test failed - timeout');
    phantom.exit();
}, 500);

那就够了

完整代码 目录结构

/projectRoot  
  /tests  
    - amd.js  
    - amdTestModule.js  
    - amd.html  
    - require.js (which I symlinked)  
    - <dependencies> (also symlinked)

$ phantomjs tests/amd.js
amd test successful

amd.html

<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
</head>

<body>
    <script data-main='amdTestModule.js' src='require.js'></script>
</body>

</html>

你有没有想过？我还有点。。。您可以访问实际的requirejs require变量，如下所示：require=null；injectJs（'target/dependencies/requirejstar.gz/require.js'）@Thomas，我会试试你的方法，：）我放弃了让它很好地工作，而是使用了github上的（日语）方法：来自于。。。我还动态生成HTML页面，以避免对我想要运行的测试进行硬编码，这又增加了一层疯狂。如果你有更简单的工作，我很想听听！我有点不确定这是否与我的问题相同，因此我在这里提出了一个新问题：

<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
</head>

<body>
    <script data-main='amdTestModule.js' src='require.js'></script>
</body>

</html>

require([<dependencies>], function(<dependencies>) {
    ...
    console.log(
        (<test>) ? "test=success" : "test=failed"
    );
});

$ phantomjs tests/amd.js
amd test successful