fex-team
requirejs和FIS如何结合使用
目前项目中是用requirejs进行模块加载管理，用FIS进行压缩打包和MD5戳，目录结构如下：
--js
index.js
--lib
jquery.js
require.js
我在index.html页面中： require(['index'],function(index){ index.init(); }); 如果我用FIS将jquery.js和require.js进行打包压缩，并且把index.js加上对应的md5，这时候require(['index'])，这个引用的index.js并不是加上MD5戳的那个js，这个问题怎么解决？ 如果我在index.js里头还引用了util.js，如果把util.js和index.js进行打包，会有问题吗？ 最近一直被这个问题困扰着，麻烦指点一下，麻烦了，十分感激！
PS：之前使用的是seajs和FIS，但是seajs一直要对一些插件进行CMD化，有点麻烦，而且同样也有打包的问题，所以最近打算转require试试 PPS：seajs这个MD5戳的问题我之前问过了，已经解决了，不过打包问题还是存在
@nwind @asoiso @fouber @walterShen
先不仿看看这个 demo https://github.com/fex-team/fis-amd-demo
md5 问题 和 pack 打包问题，目前实现方式是一样的。通过 require.config({path:{}}) 配置映射表来实现的。
好的，我看看，谢谢哈 @2betop @xiangshouding 之前一直陷在业务里头啊，就将就将就用着，最近有点受不了了，所以。。。
@2betop 你们在哪里对这两个变量进行了替换的？
index.html中
<script src="lib/require.js"></script>
<script src="config.js"></script>
<!--SCRIPT_PLACEHOLDER-->
<!--RESOURCEMAP_PLACEHOLDER-->
<script>
require(['index'], function (index) {
index.init();
});
</script>
config.js中
requirejs.config({
baseUrl: './js',
paths: {
jquery: '../lib/jquery-2.1.1'
}
});
恩，是纯前端项目 我参照你们的做法写了，发现不行，就是我上面贴的那些代码，fis-config.js里头有哪些特殊的配置吗？
fis-amd-demo在我这可以正常运行
<script src="lib/require.js"></script>
<script src="config.js"></script>
<!--SCRIPT_PLACEHOLDER-->
<!--RESOURCEMAP_PLACEHOLDER-->
<script>
require(['index'], function (index) {
index.init();
});
</script>
执行fis release之后发现
<!--SCRIPT_PLACEHOLDER-->
<!--RESOURCEMAP_PLACEHOLDER-->
没有被替换掉
有两个config，一个是关于requirejs的baseurl和paths的配置，config.js和fis-conf.js都在工程根目录下面 confis.js内容
requirejs.config({
baseUrl: './js',
paths: {
jquery: '../lib/jquery-2.1.1'
}
});
fis-conf.js的内容
// 开起 autuload, 好处是，依赖自动加载。
fis.config.set('modules.postpackager', 'autoload');
fis.config.set('settings.postpackager.autoload.type', 'requirejs');
// 设置成 amd 模式。
fis.config.set('modules.postprocessor.html', 'amd');
fis.config.set('modules.postprocessor.js', 'amd');
fis.config.set('settings.postprocessor.amd', {
paths: {
jquery: '/lib/jquery-2.1.1.js'
}
});
index.html内容
<script src="lib/require.js"></script>
<script src="config.js"></script>
<!--SCRIPT_PLACEHOLDER-->
<!--RESOURCEMAP_PLACEHOLDER-->
<script>
require(['index'], function (index) {
index.init();
});
</script>
有一个warning:[WARNI] Can not find module index in [/index.html]
这个warning也不是必现的，偶尔会出现，偶尔不会
执行release server open进到release之后的目录查看之后，发现index.js已经加上了对应的MD5戳，可是index.html中的<!--SCRIPT_PLACEHOLDER--> <!--RESOURCEMAP_PLACEHOLDER-->这个替换符没有被替换掉
查看生成的map.json
"js/index.js": {
"uri": "/js/index_ca9cf25.js",
"type": "js",
"deps": [
"jquery"
]
}
这个是没有问题的
require.js是从fis-amd-demo里头复制过来的，最后有包含这一行require.jsExtRegExp = /^\/|:\/\/|\?/;
我发现将index.html中的
require(['index'], function (index) {
index.init();
});
改成
require(['js/index'], function (index) {
index.init();
});
就可以引用到带有MD5戳的index.js，并且相应的两个替换符也被替换了，不过index.js里头就报错了 信息如下：
Uncaught Error: Mismatched anonymous define() module: function (require, exports, module) {
var $ = require("jquery");
var index = {
"init": function () {
console.log('gggasdfsfsd');
$("#login").on("click", function () {
console.log('hehehaaaa');
});
}
}
module.exports = index;
}
好吧，是因为这边这个的正则没弄好
fis.config.set('roadmap.path', [
{
reg: /\/_[^\/]*?$/i,
release: false
},
// 标记 isMod 为 true, 这样，在 modules 里面的满足 commonjs 规范的 js 会自动包装成 amd js, 以至于能在浏览器中运行。
//
{
reg: /^\/js\/(.*\.js)$/i,
isMod: true,
release: '/js\/$1'
}
]);
到这里为止，好像MD5的问题解决了。 我试试打包怎么处理。。。
请问一下，我现在使用的是knockout，现在require('knockout')进来时候一直报Mismatched anonymous define() module，它源码是这样封装的(function (){var debug = true;(function(undefined){}());})(); 这种情况应该怎么处理，急急急急急 。。。 @2betop
@2betop 引用的KO的源码地址 http://knockoutjs.com/downloads/knockout-3.2.0.debug.js
