(仅供自己使用,勿喷)

闲着无聊,尝试下seajs, 只是在公司项目上随便添加并测试了一下,做下记录, 方便以后自己使用更快的上手:

  1. 下载最新的sea.js, v- 3.0.0
  2. 新建seajsConfig.js,主要为seajs的配置,这里我只配置jquery
/**
* JS文件模块化
*/
seajs.config({
base: "./js/lib/",
alias: {
"jquery": "jquery/jquery-1.12.4.min.js"
}
})

3. 新建topMenu.js, 主要为

/**
* topMenu.jsp JS模块化定义
*
*/
define(function(require, exports, module) {
var $ = require('jquery');
//require('artdialog'); //这边添加所有需要引入当前页面的所需的JS包 // 通过 exports 对外提供接口
//exports.doSomething = ... // 或者通过 module.exports 提供整个接口
//module.exports = ... exports.init = function(){
alert("模块初始化完成,回调");
}
});

4. 这会 $ 为空, 需修改JQuery源码:

define(function(){

    //此处为jquery源码
return $.noConflict();
});

5. 最后topMenu.jsp

<script type="text/javascript" src="js/seajs/3.0.0/sea.js"></script>
<script type="text/javascript" src="js/ets/seajsConfig.js"></script>
<script type="text/javascript">
seajs.use("./js/app/topMenu",function(m){
m.init();
});
</script>

最后注意几个地方:

1. 因为刚接触seajs,觉得很多依赖jquery的组件或者JSP代码下需要$来操作的话,个人觉得还是以在页面中引入jquery文件,topMenu.js只引入一些常用的公共jquery等组件,比如窗口、校验等JS组件。

<script type="text/javascript" src="common/jquery/jquery-1.7.2.min.js"></script>
<script type="text/javascript" src="js/seajs/3.0.0/sea.js"></script>
<script type="text/javascript" src="js/ets/seajsConfig.js"></script>
<script type="text/javascript">
seajs.use("./js/app/topMenu",function(m){
m.init();
});
</script>

只研究了2小时,因为seajs加到当前系统中比较繁琐,所以放弃JS模块化,因为是后台系统,对性能没特殊要求。

最后贴下目录

好了 OK了, 方便以后自己使用。

初尝seajs,只提供自己学习做笔记的更多相关文章

  1. this指向问题,只提供案例,不做任何分析

    希望大家在测试的道路上找到答案,阔步前行 <script type="text/javascript"> /*this指向 console.log(this); fun ...

  2. seajs初尝 加载jquery返回null解决学习日志含示例下载

    原文地址:http://www.tuicool.com/articles/bmuaEb 如需demo示例,请点击下方链接下载: http://yunpan.cn/cVEybKs8nV7CF  提取码 ...

  3. .NET领域驱动设计—初尝(三:穿过迷雾走向光明)

    开篇介绍 在开始这篇富有某种奇妙感觉的文章之旅时我们先短暂的讨论一下关于软件开发方法论的简要: 纵观软件开发方法论,从瀑布模型.螺旋模型.RUP(统一软件开发过程).XP(极限编程).Agile(敏捷 ...

  4. .NET领域驱动设计—初尝(一:疑问、模式、原则、工具、过程、框架、实践)

     .NET领域驱动设计—初尝(一:疑问.模式.原则.工具.过程.框架.实践) 2013-04-07 17:35:27 标签:.NET DDD 驱动设计 原创作品,允许转载,转载时请务必以超链接形式标明 ...

  5. 初尝 Perl

    本文将阐述以下几方面内容: 1.什么是Perl 2.Perl有什么用 3.Windows 下的Perl环境搭建 4.Perl 版Hello World 5.Perl 语法梗概 6.一些参考资料 什么是 ...

  6. 视频编辑SDK---我们只提供API,任你自由设计炫酷的功能

    面对相对复杂的视频编辑处理技术,你是否束手无策? 在短视频应用中,有一定技术难度的视频编辑技术中,我们提出了一种全新的解决方法:画板和画笔.短视频处理,用画板和画笔,就够了! 我们设计了极其简单易懂的 ...

  7. 国产芯片任重道远 国科微SSD主控芯片的“追赶之路”(不能只提供一颗芯片,而是要将芯片、国密算法、固件Firmware、BIOS和操作系统紧密联系在一起,变成完整解决方案交给行业用户,才能真正体现自身的价值)

    集微网消息,“中国芯”战略之路道阻且长,踏入这个赛道的攻坚者们需要十年如一日的技术突破,需要集合产业势能,共同协作,方能建立中国核心技术真正的竞争力. 国产化之路任重道远,SSD芯片初见成效 信息时代 ...

  8. Github原生CI/CD,初尝Github Actions

    Github 原生 CI/CD,初尝 Github Actions Intro Github 目前已经推出了自己的 CICD 服务 -- Github Actions,而且比微软的 Azure Dev ...

  9. 初尝Windows 下批处理编程

    本文叫“ 初尝Windows 下批处理编程”是为了延续上一篇“初尝 Perl”,其实对于博主而言批处理以及批处理编程早就接触过了. 本文包括以下内容 1.什么是批处理 2.常用批处理命令 3.简介批处 ...

随机推荐

  1. 【腾讯Bugly干货分享】让 CodeReview 这股清流再飞一会儿

    本文来自于腾讯Bugly公众号(weixinBugly),未经作者同意,请勿转载,原文地址:https://mp.weixin.qq.com/s/ToYeT4Y4pzx0ii9Z92fo-Q 作者:刘 ...

  2. 预装win8的系统换win7需要做的bios设置

    https://zhidao.baidu.com/question/873669708066476212.html (一)联想G50-70由于预装的是WIN8位系统,哪么改装WIN7 64位的方法如下 ...

  3. Android之ImageView 设置宽高

    方案一: 设置布局参数 imageView.setLayoutParams(new LinearLayout.LayoutParams(newWidth, newWidth));

  4. EXTJS 5.0 资料

    http://blog.csdn.net/sushengmiyan/article/category/2435029

  5. [转] npm install 本地安装与全局安装的区别

    npm的包安装分为本地安装(local).全局安装(global)两种,从敲的命令行来看,差别只是有没有-g而已,比如 npm install grunt # 本地安装 npm install -g  ...

  6. zstuoj 4243

    牛吃草 Time Limit: 1 Sec  Memory Limit: 128 MBSubmit: 441  Solved: 139 Description 农夫有一个长满草的(x0, y0)为圆心 ...

  7. mysql获取当前日期的周一和周日的日期

    ,,date_format(curdate(),)//获取当前日期 在本周的周一 的日期 ,,date_format(curdate(),)//获取当前日期 在本周的周日 的日期

  8. Linux - script练习

    首先HelloWorld 对谈式脚本:变量内容由使用者决定 随日期变化:利用date进行文件的创建 比较直接运行与利用source来运行脚本的区别

  9. PhotoshopCS5中将单位修改成百分比

    PhotoshopCS5中单位默认是厘米或px,当用同一动作修改两张照片时,会因为片子大小不同,修改收到影响.若将单位修改成百分比,则动作会根据照片大小,自动进行调整. 1)选择菜单栏中的“编辑”选项 ...

  10. Java核心技术及面试指南 设计模式部分的面试题总结以及答案

    8.6.4.1请实现一个线程安全的单例模式. 1      public class MailListReader { 2          private static MailListReader ...