SeaJs学习笔记$为null

最近在接触seajs，记录学习过程中遇到的困难。

3-10：

在引进jQuery的时候，发现$为null。先把代码贴上

//配置
seajs.config({

　　　　base: "./js/",
　　　　alias:{
　　　　　　"jquery":"jquery.js"
　　　　}
　});
　seajs.use("./js/main");

//主模块
define(function(require, exports, module) {
 　 var $ = require('jquery');	
　　console.log($); //null
});

我的所有JS都在项目目录下的js文件夹中，这样看是没问题的，结果怎么也找不到问题所在，上网查了查，问题出在jquery文件上。因为用的是seajs框架所以文件格式得遵循CMD的规范，所以我们普通用的插件是没被模块化的，所以得先模块化。如何模块化呢，有两种方法。

第一种

把下列代码放在jQuery源代码的最后面，这里的后面是指jQuery文件自执行函数最后面，不是执行函数外面。

//2.3.0版本的写法
if ( typeof define === "function" ) {
　　define(function () { return jQuery; } );
}

//2.2.0的写法
if ( typeof module === "object" && module && typeof module.exports === "object" ) {	
　　module.exports = jQuery;
} else {
　　if ( typeof define === "function" ) {
	define(function () { return jQuery; } );
　　}
}
;$.noConflict(); //这是2.2.0版本在自执行函数外面加的

上面两种写法都可以。

第二种　

define(function(){  
  //jquery code源代码   
  
  return $.noConflict(true);  
});  

把jQuery全部的源代码放进模块里。

 

上面的两种解决方法是针对那些直接把以前jQuery文件拖过来用的情况。可是我是下载的官方文档，把里面已经模块化过的jQuery文件拿来用的，可还是不行。仔细看了看，终于找到原因了。下面是官方模块后的jQuery文件的一部分代码

if ( typeof define === "function" ) {
　　define("jquery/jquery/1.10.1/jquery", [], function () { return jQuery; } );
}

大家发现问题没有，官方把模块的ID命名了，而我上面的配置是alias:{"jquery":"jquery.js"},这里我配置的路径和模块的ID对不上，这里就涉及到了SeaJs里面一个路径和ID匹配的原则，这也是我出现问题的所在。

seajs的设计思想是，路径即ID。一般在调用define()方法时，如果只传递一个factory function，那么这个模块就是个匿名模块；或者传递define(module_id, dependency, factory)，这个模块就是个具名模块。

如果一个文件就是一个模块，那么匿名模块就可以了。但是在生产环境中，往往会把多个模块放到一个文件里，但是路径只有一个，如何知道要加载哪个模块呢？这时候就需要给其中一个模块赋予module_id，和path保持一致，seajs就知道应该加载这个ID和path匹配的模块了。如果具名模块的id和require的path参数不匹配，就会返回null。

返回我的代码里，我配置的路劲是jquery.js，而当前jQuery的模块ID是"jquery/jquery/1.10.1/jquery-debug"，所以根据我们上面所讲的seajs路径和ID匹配的原则， 模块返回的就是null了，这种情况很好解决，也有两种方法。

第一种：修改配置路径如下：

seajs.config({
	base: "./js/",
	alias:{
		"jquery":"jquery/jquery/1.10.1/jquery.js"//此时jquery.js放置的必须位置和设置的一致

} });

第二种：去掉模块ID和依赖项只剩factory，把模块变成匿名模块，这样它的ID就默认为文件名了。

if ( typeof define === "function" ) {
	define( function () { return jQuery; } );
}

通过这两种方法来让路径和ID保持一致。

本人为前端菜鸟，上述言论有误之处，希望大家能在下方评论指出，如果其他方法或疑惑也可以提出来，大家一起成长~~