0

我正在尝试使用 requirejs 的 grunt 插件组合文件：

https://www.npmjs.org/package/grunt-contrib-requirejs

这是配置：

requirejs:
      compile:
        options:
          #appDir: './'
          baseUrl: "client"
          mainConfigFile: "client/test1.js"
          name: "test1"
          out: "build/test.js"
          onModuleBundleComplete: (data) ->
            outputFile = data.path
            fs.writeFileSync(outputFile, amdclean.clean(
              'filePath': outputFile
            ))
          wrap:
            start: ""
            end: ""

这是输入和输出javascript

输入：test1.js

var x = console;
require(['test2'], function() {
  return console.log('Hello');
});

test2.js

x.log('this is test2');

测试.js

var test2, test1;
x.log("this is test2"), null, test2 = undefined;
var x;
x = console, function () {
    return console.log("Hello")
}(), test1 = undefined;

该程序在使用 requirejs 加载到浏览器中时运行良好。但是构建完成后，它不起作用。这是因为在x=console使用 requirejs 加载模块时，在加载 test2.js 中的代码之前提供了定义。

但是，在构建之后，在x=console加载来自 test2.js 的代码之后会出现定义——这会产生一个错误——因为 test2.js 调用了 x ，它是两个 js 文件之间的全局变量。

我需要确保 requirejs 将项目构建到单个 .js 文件中，同时确保不存在 amd 代码（require/define），并且代码的执行顺序与在浏览器中加载 requirejs 的顺序完全相同。

4

1 回答 1

1

我认为您可能需要更好地理解异步模块定义( AMD ) API 规范。无论哪种情况，我都稍微修改了您的代码以更好地遵守 AMD 的语法，并且我创建了第三个文件来定义x如下：

  1. test1.js

    // Require the 'test2' module (which is passing x; which is equal to console)
require(['test2'], function(x){
  x.log('this is test1');
});

  2. test2.js

    // Define the 'test2' module which depends on the 'x' module
define(['x'], function(x){
  x.log('this is test2');
  return x; // Return x; which is equal to console
});

  3. x.js

    // Define the 'x' module which has no dependencies
define(function(){
  console.log('this is x');
  return console; // Return console
});
于 2014-05-30T14:37:31.710 回答