使用grunt优化requirejs应用程序时的依赖性错误

时间:2014-03-03 17:27:44

标签: javascript backbone.js requirejs gruntjs grunt-contrib-requirejs

我正在尝试使用grunt缩小我的requirejs应用程序,它输出所有缩小的文件,我的main.js获取所有使用的脚本等...我在定义公用文件夹的级别运行grunt

但是当我尝试运行优化的主js文件时,它不起作用,并说Backbone没有为我的'kinvey'模块定义..(//da189i1jfloii.cloudfront.net/js/kinvey-backbone-1.1。 6.min.js)请帮助我搜索了几个小时但它不起作用!

目录布局:

public
 - js
  - libs (all libraries i use)
  - folders / containing modules
  - main.js
  - app.js
 - img ...

main.js:

require.config
(
    {
        paths : {
            'jquery' : 'libs/jquery-1.10.1.min',
            'backbone' : 'libs/backbone.min', // -1.1.2 amd
            'underscore' : 'libs/underscore-1.6.0.min',
            'kinvey' : 'libs/kinvey-backbone-1.1.6.min' // amd
        },
        shim : {
            'underscore' : {
                exports : '_'
            },
            'backbone' : {
                exports : 'Backbone',
                deps : ['jquery','underscore']
            },
            'kinvey' : {
                deps: ['backbone','underscore'],
                //exports: 'Kinvey',
            }
        },
        //deps : ['jquery','underscore']            
    }
);

require
(
    ['backbone', 'kinvey', 'app'],
    function(Backbone, Kinvey, Application)
    {
        'use strict';

        var init = Kinvey.init({ appKey: '...', appSecret : '..'});

        init.then(function(activeUser)
        {       
            if (!activeUser)
            {
                window.location = '/login';
            }
            else
            {
                Application.start();
            }
        }, function(error) {
            alert("Something went wrong.. Please try again.");
            window.location = '/home';
        });     
    }
);

grunt文件包含:

                mainConfigFile: "public/js/main.js",
                modules: [
                    {
                        name: 'main',
                     include: ['backbone',
              'kinvey',
              'app']
          }
                ],
                //name: "libs/almond", // node_modules/almond/almond.js
                //wrap: true,
                optimize : 'none',
                dir: "release",

由于某种原因输出文件包含主干模块,然后在kinvey代码下面..但由于某些原因,当运行kinvey代码时,Backbone不存在,但它需要因为它依赖于它(就像我在配置中所做的那样。)

未优化时工作正常!

请帮帮我,我很无能......

2 个答案:

答案 0 :(得分:1)

您的配置中有注释,在您的Backbone路径旁边和Kinvey路径旁边说“amd”。 AMD风格的模块不需要垫片。 (快速检查Backbone 1.1.2和Kinvey 1.1.6的代码显示它们都调用define,因此是AMD风格的模块。)

不必要的垫片的存在通常不会导致立即问题。因此,当代码未优化时,您可以使用不必要的填充程序,但在优化代码时会失败。或者,举一个完全不同的例子,代码适用于Chrome但在IE8上失败。依此类推......,

编辑:好的,所以你指出(正确地)Kinvey没有在其依赖项中列出Backbone。这可能是因为在Backbone被修改为AMD支持之前,那个版本的Kinvey仍然期望Backbone的旧版本。你有多种选择:

  • 使用不符合AMD标准的旧版Backbone。你需要一个垫片。 (Kinvey仍然没有垫片。)

  • 故意将Backbone导出到全球空间。您可以在require.config文件中调用main.js之后修改代码,如下所示:

    require(['backbone'], function (Backbone) {
        window.Backbone = Backbone;
        require(['kinvey', 'app'], function(Kinvey, Application) {
            'use strict';
    
            var init = Kinvey.init({ appKey: '...', appSecret : '..'});
            // Etc. Same code as you originally had.
        });
    });
    

在加载 backbone之前加载kinvey ,并将其导出到全局空间。然后Kinvey应该能够找到它。

答案 1 :(得分:0)

这里的问题

尝试加载主干1.0.0

我对主干1.1.2有同样的问题

这是一个可能有用的问题跟踪器

https://github.com/jrburke/requirejs/issues/987

Backbone 1.0.0 似乎已经为我解决了这个问题。