Module 使用最新版本的文件名和requirejs依赖项

Module 使用最新版本的文件名和requirejs依赖项,module,dependencies,requirejs,assets,gruntjs,Module,Dependencies,Requirejs,Assets,Gruntjs,我在requirejs和usemin中遇到了以下问题: 我想设置一个多页面应用程序,动态加载只包含页面特定功能的模块(例如about->about.js,home->home.js)。我可以将所有内容打包到一个文件中,但这只会导致更大的文件大小和每个站点不需要的功能开销!(例如,为什么我需要在没有旋转木马的页面上加载旋转木马插件!) 我检查了这个例子 事实上,这是一个很好的解决方法,直到我把usemin带到游戏中。在提升文件名之后,每个脚本标记的src路径都会更新,但是依赖关系呢 <scr

我在requirejs和usemin中遇到了以下问题:

我想设置一个多页面应用程序,动态加载只包含页面特定功能的模块(例如about->about.js,home->home.js)。我可以将所有内容打包到一个文件中,但这只会导致更大的文件大小和每个站点不需要的功能开销!(例如,为什么我需要在没有旋转木马的页面上加载旋转木马插件!)

我检查了这个例子

事实上,这是一个很好的解决方法,直到我把usemin带到游戏中。在提升文件名之后,每个脚本标记的src路径都会更新,但是依赖关系呢

<script src="scripts/vendor/1cdhj2.require.js"></script>
<script type="text/javascript">
   require(['scripts/common'], function (common) {
      require(['app'], function(App) {
          App.initialize();
      });
   });
</script>

需要(['scripts/common'],函数(common){
需要(['app'],函数(app){
App.initialize();
});
});
在这种情况下,require.js被修订的文件1cdhj2.require.js替换。太好了

但是所需的模块“common”和“app”不再工作,因为common变成了4jsh3b.common.js,app变成了23jda3.app.js

我能做些什么?谢谢你的帮助!
(顺便说一句,也使用Yeoman)

这是一个棘手的问题,我相信其他人会以一种更优雅的方式解决,但下面的内容对我很有用

一旦它变得更健壮一点,我可能会将其作为grunt插件发布

摘自我的Gruntfile:

“regex替换”:{
rjsmodules:{//稍后我们将在“userevd rjsmodules”任务中构建此配置
src:['build/***/.js'],
行动:[]
}
},
registerTask('userevd-rjsmodules','确保RequireJS模块是通过其修订的模块名加载的',function(){
//计划的搜索和替换操作
var actions=grunt.config(“regex replace”).rjsmodules.actions;
//动作对象
变量o={
搜索:“”,
替换:“”//
旗帜:“g”
};
//阅读requirejs配置并查找优化的模块
var modules=grunt.config(“requirejs.compile.options.modules”);
var baseDir=grunt.config(“requirejs.compile.options.dir”);
变量i,mod;
用于(模块中的i){
mod=模块[i]。名称;
revvedMod=grunt.filerev.summary[baseDir+“/”+mod+.js];
revvedMod=revvedMod.replace('.js','').replace(baseDir+'/','');
o、 name=mod;
o、 search=“”+mod+”;
//使用moduleid和grunt.filerev.summary对象在磁盘上查找已升级的文件
o、 replace=“”+revvedMod+”;
//通过安排搜索/替换操作来更新require([“xxx/yyy”])声明
动作。推(o);
}
grunt.config.set('regex-replace.rjsmodules.actions',actions');
grunt.log.writeln(“%j”,grunt.config(“regex replace.rjsmodules”);
run(“regexreplace:rjsmodules”);
}),

您还可以使用requirejs的映射配置来指定原始模块和更新模块之间的映射。 Filerev输出一个摘要对象,其中包含所有已版本化的模块及其原始名称的映射。使用grunt文件写入功能以AMD方式写入文件,内容为摘要对象:

// Default task(s).
grunt.registerTask('default', ['uglify', 'filerev', 'writeSummary']);

grunt.registerTask('writeSummary', 'Writes the summary output of filerev task to a file', function() {
    grunt.file.write('filerevSummary.js', 'define([], function(){ return ' + JSON.stringify(grunt.filerev.summary) + '; })');
})
并在require配置中使用此文件,以便使用新版本的模块而不是旧模块:

require(['../filerevSummary'], function(fileRev) {

var filerevMap = {};
for (var key in fileRev) {
    var moduleID = key.split('/').pop().replace('.js', '');
    var revvedModule = '../' + fileRev[key].replace('.js', '');

    filerevMap[moduleID] = revvedModule;
}

require.config({
    map: {
        '*': filerevMap
    }
});

我在上面创建的filerevMap对象特定于我的文件夹结构。你可以根据自己的想法来调整它。它只是在filerev摘要中循环,并确保根据您的模块名称和值以及文件夹结构修改键。

是否
r.js
为您压缩依赖项?你为什么需要usemin?
require(['../filerevSummary'], function(fileRev) {

var filerevMap = {};
for (var key in fileRev) {
    var moduleID = key.split('/').pop().replace('.js', '');
    var revvedModule = '../' + fileRev[key].replace('.js', '');

    filerevMap[moduleID] = revvedModule;
}

require.config({
    map: {
        '*': filerevMap
    }
});