如何从uglifying / optimization中排除某些requireJS文件

时间:2013-05-13 12:36:24

标签: requirejs require gruntjs uglifyjs uglifyjs2

我有一个正在使用grunt进行构建和部署的工作requirejs项目。如果根本不使用优化,那么构建工作没有问题,我得到一个大的js文件来在生产中部署它。

我遇到的问题是,我有一些外部框架(如angularJS),我已经有一个最小化/优化版本,并且不想再次优化它。

目前没有优化我通过gruntfile中的单独路径配置包含此框架的缩小版本。而在我的普通main.js中,我有非缩小版本用于开发。

现在我想使用优化器优化我自己的代码,但不优化外部框架。但是外部框架应该包含在生成的大javascript文件中。基本上我想告诉优化器他应该在某些情况下使用原始文件。

我可以这样做吗?

我只找到了一个全局排除选项,因此有些模块根本不包含在生成的优化js中。

这是我的笨拙配置:

requirejs: {
            compile: {
                options: {
                    baseUrl: "<%= pkg.folders.jsSource %>",
                    name: "../external-libs/almond-0.1.1",
                    include: "main",
                    mainConfigFile: "<%= pkg.folders.jsSource %>/main.js",
                    out: "<%= pkg.folders.build + pkg.name + '-' + pkg.version %>/js/main.js",
                    //logLevel: 0,
                    optimize: "uglify2",
                    //optimize: "none",
                    paths: {
                        'angular':'../external-libs/min/angular-1.0.4',
                        'jquery':'../external-libs/min/jquery-1.7.2',
                        'jquery.mobile':'../external-libs/min/jquery.mobile-1.2.0',
                        'adapter': '../external-libs/min/jquery-mobile-angular-adapter-1.2.0',
                        'moment': '../external-libs/moment-1.6.2.min',
                        'iscroll': '../external-libs/min/iscroll-4.2.5',
                        'iscrollview': '../external-libs/min/jquery.mobile.iscrollview-1.2.6',
                        'add2Home': '../external-libs/min/add2home',
                        'config/config': "config/<%=configDatei%>"
                    }
                }
            }
        },

这是main.js的相关部分:

require.config({
        paths:{
            'angular':'../external-libs/angular-1.0.4',
            'jquery':'../external-libs/jquery-1.7.2',
            'jquery.mobile':'../external-libs/jquery.mobile-1.2.0',
            'adapter': '../external-libs/jquery-mobile-angular-adapter-1.2.0',
            'moment': '../external-libs/moment-1.6.2.min',
            'iscroll': '../external-libs/iscroll-4.2.5',
            'iscrollview': '../external-libs/jquery.mobile.iscrollview-1.2.6',
            'add2Home': '../external-libs/add2home'
        },
        shim:{
            'angular':{ deps:['jquery'], exports:'angular' },
            'iscroll':{ deps:['jquery'], exports:'iscroll' },
            'iscrollview':{ deps:['jquery.mobile', 'iscroll'], exports:'iscrollview' }
        }
    });

感谢您的帮助。

2 个答案:

答案 0 :(得分:19)

只是一些建议使用empty:表示 NOT 以将模块包含在优化中。

然后在require.config中指出min文件的用法。

requirejs: {
            compile: {
                options: {
                    {{ all other settings }}
                    paths: {
                        'angular':'empty:',
                    }
                }
            }
        },

   require.config:{  
              paths:{
              'angular':'../external-libs/min/angular-1.0.4',
        },
   }

请注意,这是“为空:”,最后带冒号,而不是“空”。如果省略冒号,则会出现如下错误:

"No such file or directory [...]/empty.js" 

希望这有帮助。

答案 1 :(得分:5)

我有同样的问题,外部库总是被重新缩小为答案的评论,这是我用来解决这个问题的方法。我有两个任务,一个用于我的代码,一个用于外部库。它实际上只是复制文件 - 所以只需复制任务也可以。我也使用外部库的“empty:”关键字,以便不包含在我的代码的缩写中。

requirejs: {
    options: {
        mainConfigFile: '...',
        fileExclusionRegExp '...common things to exclude...'
    },
    main: {
        options: {
            baseUrl: '.../js',
            dir: '.../js-built',
            fileExclusionRegExp: /^external$/,
            ... etc ...
        }
    },
    external: {
        options: {
            baseUrl: '.../js/external',
            dir: '.../js-built/external',
            optimize: 'none'
        }
    }
}