减少RequireJS模块之间的代码重复

Reduce duplication of code among RequireJS modules

本文关键字：代码 之间 RequireJS 模块 减少      更新时间：2023-09-26

我使用RequireJS，我有以下r.js的构建配置文件。我的主文件是app.js，它导入jquery、ember、handlers和下划线。我有另一个特定于我的应用程序页面的文件change_email.js。它也导入ember。

({
    modules: [{
        name: 'js/app',
        // jQuery is included in the page
        exclude: ['jquery'],
        include: ['ember', 'handlebars', 'underscore']
    }, {
        name: 'js/change_email',
        exclude: ['jquery', 'js/app']
    }],
    mainConfigFile: 'requirejs_config.js'
})

我的RequireJS配置看起来像：

requirejs.config({
    paths: {
        'jquery': 'js/lib/jquery',
        'ember': 'js/lib/ember-1.0.0-rc.6.1',
        'handlebars': 'js/lib/handlebars-1.0.0-rc.4',
        'underscore': 'js/lib/underscore'
    },
    shim: {
        'underscore': {
            exports: '_'
        },
        'ember': {
            deps: ['jquery', 'handlebars'],
            exports: 'Ember'
        },
        'handlebars': {
            exports: 'Handlebars'
        }
    }
});

我注意到，有时当我加载页面时，Ember是从app.js运行的，有时它是从ember-1.0.0-rc.6.1.js运行的。我认为这是一种种族状况。在Ember从ember-1.0.0-rc.6.1.js运行的情况下，已经下载了2个包含Ember的文件app.js和ember-1.0.0-rc.6.1.js。这似乎违背了直觉，因为使用RequireJS的目标之一是减少下载的代码量。

我想过让app.js导入，然后导出ember，让其他模块从app.js中导入ember。我真的不喜欢这个想法，因为它要求我将导入更改为非自然的样式。

消除重复的最有效方法是什么？

错误在于没有定义生产代码应该从哪里加载模块。通过在我的生产配置中定义以下内容，我使一切都正常工作。

requirejs.config({
    baseUrl: '/static',
    paths: {
        'jquery': 'js/app',
        'ember': 'js/app',
        'handlebars': 'js/app',
        'underscore': 'js/app',
        'underscore.string': 'js/app'
    }
});
相关文章：