seajs初嘗 加載jquery返回null解決學習日誌

今天早上初嘗seajs，發現一個很是蛋疼的事情，使用官方demo中的jquery是沒有問題，

下載官方最新版jquery 2.1.1發現console.log($)返回null，百思不得其解！只能求助度娘！

在GitHub發現了玉伯的說明 《直接調用 jQuery 插件等非標準模塊的方法》

不過這方法在2.3版本貌似已經不行,seajs.modify方法已在這版本移除！

https://github.com/seajs/seajs/issues/286

這裏的標準模塊指的是AMD和CMD的定義

引用玉伯在知乎的詳細回答

http://www.zhihu.com/question/20351507/answer/14859415

如下引用玉伯的回覆你們會更加深刻了解

@lifesinger 昨天折騰得太累了，很差意思。後來仍是用 RequireJs 解決問題。
另外，我想問問：
1. AMD 是否是容易卡死UI？ 
2. 爲何採用與 SeaJs一樣採用 CMD 規範編寫的 NodeJs 模塊 不能直接調用——我大概觀察了下，好像定義格式不太同樣，這也是問題啊，既然遵循一樣的規範爲何格式又不同，
3. 用常規全局變量寫法寫的腳本通過 shim 配置，在 var ejs = require('ejs') 後會覆蓋 ejs 的（全局）定義，可是能夠直接 require('ejs')，而後 ejs 會註冊到window 名下。
4. 把一個常規腳本，換成 SeaJs 標準格式 跟 RequireJs 轉換有什麼不一樣嗎？
另另外，感受RequireJS 的自動加載插件機制挺不錯。

@iahu
AMD 是一加載就執行，當一次加載不少文件時，意味着會馬上執行大量腳本，這時可能會致使 UI 卡。CMD 的執行是分散的，所以通常來講不會形成 UI 卡。
SeaJS 與 Node.js 的關係，可參考這篇文檔：#275
shim 配置後，require('ejs') 獲得的 ejs 就是全局那個 ejs，也能夠將掛載在 window 上的 ejs 去掉，好比
seajs.config({
  plugins: ["shim"],
  alias: {
     src: 'path/to/ejs.js',
     exports: function() { var ejs = window.ejs; window.ejs = undefined; return ejs }
  }})
RequireJS 的 shim 插件，本質上和 SeaJS 是同樣的。

以上提到的方法已過期了，只好繼續嘗試其餘辦法！

方法一：

仍是玉伯老大的辦法《seajs 2.1.1中去掉了seajs.modify 後，如何preload CDN 中的jquery ？》

https://github.com/seajs/seajs/issues/862

整個文章主要是說不修改成CMD模式下在模塊內部使用jquery，玉伯老大是不推介這樣，但仍是能夠實現

不過jquery文件就不是在seajs.config裏配置了，是直接在head頭部引入文件，就像平時那樣，而後在seajs內部某個事件機制觸發將全局的jQuery對象帶到內部module.exports對象；

seajs.on('exec', function(module) {
	if (module.uri === seajs.resolve('jquery')) {
		window.$ = window.jQuery = module.exports;
	}
});

方法二：

固然就是按照CMD定義作封裝一次jquery，方法也很簡單，只要把源代碼粘進去，而後返回jquery對象便可；

define(function(){
    //jquery源代碼
    return $.noConflict();
});

這樣就能夠在seajs.config引入文件在內部其餘模塊使用,這裏返回爲何是$.noConflict(),請看w3c學校介紹

http://www.w3school.com.cn/jquery/core_noconflict.asp

seajs.config({
	base : "../sea-modules/",
	alias : {
		"jquery" : "jquery.js"
	}
});

define(function(require, exports, module){
	var $ = require("jquery");
	exports.showObj = function() {
		console.log($);
	}
});

方法三：

參照seajs官方jquery封裝方法

if ( typeof module === "object" && module && typeof module.exports === "object" ) {
    module.exports = jQuery;} else {
    if ( typeof define === "function" && define ) {
        define( "jquery", [], function () { return jQuery; } );
    }}if ( typeof window === "object" && typeof window.document === "object" ) {
    window.jQuery = window.$ = jQuery;}

在GitHub下載

https://github.com/seajs/examples

在目錄 sea-modules/jquery 裏就有封裝好的1.10版本；

最後附上seajs插件開發指南

https://github.com/seajs/seajs/issues/264