正文 

当前位置： 首页 > java > java语法

seajs入门使用

zhchoutai      2022-02-10     389

关键词：

使用 Sea.js 进行模块化开发还能够带来非常多优点：

  1. 模块的版本号管理。

    通过别名等配置，配合构建工具，能够比較轻松地实现模块的版本号管理。

  2. 提高可维护性。模块化能够让每一个文件的职责单一，很有利于代码的维护。Sea.js 还提供了 nocache、debug 等插件，拥有在线调试等功能。能比較明显地提升效率。

  3. 前端性能优化。

    Sea.js 通过异步载入模块，这对页面性能非常故意。

    Sea.js 还提供了 combo、flush 等插件，配合服务端，能够非常好地对页面性能进行调优。

  4. 跨环境共享模块。

    CMD 模块定义规范与 Node.js 的模块规范非常相近。通过 Sea.js 的 Node.js 版本号。能够非常方便实现模块的跨server和浏览器共享。



seajs的文件结构 ：
技术分享

以上步骤完毕，接下来演示一个怎样简单的使用seajs

第一步：
   

define

   用来定义模块。Sea.js 推崇一个模块一个文件，遵循统一的写法：
define(function(require,exports,module){
    
	  var _msg = ‘not set msg!‘;
	  exports.setMsg = function(msg){
		  _msg = msg;
	  };
	  
	  exports.getMsg = function(){
		  return _msg;  
	  };
});

第一个參数：require用来获取指定的接口，注意require仅仅接受字符串直接是量作为參数
第二个參数：exports用来在模块内部对外部提供接口
第三个參数：module与exports类似，用来在模块内部对外提供接口

第二步：
   当模块定义好了。那么就把刚才配置好的模块配置入seajs。

seajs.config

seajs.config({
    alias:{
         ‘init‘:"modul/init.js"
        }
});

init表示模块的id是自己定义的，“modul/init.js”是模块的相对路径能够省略js。注意：模块的绝对路径是seajs-2.3.0/dist/modul/init.js

seajs.use

用来在页面中载入一个或多个模块。

seajs.use("init", function(init){
	 //设置值
	 init.setMsg(‘Hello World‘);
     alert(init.getMsg());
});

效果：

技术分享

  
HTML页面的代码：
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<!-- 导入seajs-2.3.0这个文件 -->
<script type="text/javascript" src="seajs-2.3.0/dist/sea.js"></script>
   
<script type="text/javascript">
//配置seajs
seajs.config({
    alias:{
         ‘init‘:"modul/init.js"
        }
});

//使用seajs
seajs.use("init", function(init){
	 //设置值
	 init.setMsg(‘Hello World‘);
     alert(init.getMsg());
});
</script>
</head>
<body>
     <h1>Test seajs</h1>
     
</body>
</html>

















简单的使用seajs

 什么是SeajsSeajs是一个加载器 http://yslove.net/seajs/遵循CMD规范模块化开发，依赖的自动加载、配置的简洁清晰。兼容性Chrome3+Firefox2+Safari3.2+Opera10+IE5.5+基本应用导入Seajs库去官网下载最新的seajs文件， http://seajs.org/docs/#dow... 查看详情

seajs使用方法

 必须执行seajs.use()时，才能自动执行预加载项<scriptsrc="/UILib/sea.js"></script><scriptsrc="/UILib/seajs-preload.js"></script><%--<scriptsrc="/UILib/seajs-css.js"></script> 查看详情

seajs简易使用

一.模块化格式define(function(require,exports,module){varinit=function(){vartextContent=[‘yesitworks‘,‘seajsdemo‘,‘itisaluckyday‘,‘wishthishelpyou‘,‘thankyouforreading‘];varindex=Math.floor(Math.random()*tex 查看详情

seajs使用

 开始使用seajs的时候折磨了我好一阵。光是各种概念就让新手难理解。现在弄清楚了，上个实践以备忘。目录结构如图。1.文件sea.html main.js a.js b.js c.js最后还要一个seajs，其中main.js是入口文件，a.jsb.jsc.js都是... 查看详情

seajs是什么及其优缺点&如何使用？

这篇文章主要介绍了Seajs的相关知识和和学习心得,适合刚接触SeaJS的同学,需要的朋友可以参考下，有更好的新手教程或文档，欢迎推荐、分享！1.Seajs简介 Seajs，一个Web模块加载框架，追求简单、自然的代码书写和组织方式，... 查看详情

seajs基本开发原则

SeaJS基本开发原则在讨论SeaJS的具体使用前，先介绍一下SeaJS的模块化理念和开发原则。使用SeaJS开发JavaScript的基本原则就是：一切皆为模块。引入SeaJS后，编写JavaScript代码就变成了编写一个又一个模块，SeaJS中模块的概念有点类... 查看详情

seajs使用说明(代码片段)

seajs是淘宝的前UED玉伯写的，可以在http://seajs.org/docs/看到更全面的说明在Sea.js中，所有JavaScript模块都遵循CMD（CommonModuleDefinition）模块定义规范。该规范明确了模块的基本书写格式和基本交互规则。在CMD规范中ÿ... 查看详情

seajs和requirejs

一、seajs　　1.使用seajs的一般步骤　　　　a)在主页面引入sea.js　　　　b)写模块　　　　c)在主页面使用模块　　2.模块的写法　　math.js1define(function(require,exports,module){2varsquareObj=require("square");3module.exports={4add:function(a,b){5returna+ 查看详情

seajs简介和完整实例

...，可简单理解为JS文件的加载器，它非常适合在浏览器中使用，它可以确保所依赖的JS文件加载完成之后再加载当前的JS文件，这在大量使用JS文件的项目中可确保各个JS文件的先后加载顺序，确保避免了以前因某些原因某个文件... 查看详情

seajs--模块启动(代码片段)

首先引入seajs，然后使用seajs.use(“./a",[callback])seajs还可以并发加载多个模块：////并发加载模块a和模块b，并在都加载完成时，执行指定回调seajs.use(['./a','./b'],function(a,b)a.init();b.init(););seajs. 查看详情

模块化之seajs

...。seajs.configObjectaliasObject别名配置，配置之后可在模块中使用require调用 require(‘jquery‘);seajs.config({alias:{‘jquery‘:‘jquery/jquery/1.10.1/jquery‘}});de 查看详情

seajs.use调用模块

参考技术Aseajs.useFunction//用来在页面中加载模块通过use方法，可以在页面use方法还可以一次加载多个模块实例注意：seajs.use与DOMready事件没有任何关系。如果某些操作要确保在DOMready后执行，需要使用jquery等类库来保证，比如： 查看详情

seajs的模块化开发--实践笔记

...的解决复杂项目中命名冲突、依赖、性能等问题。SeaJS中使用define函数定义一个模块。define可以接收三个参数：require, exports, module。    require——模 查看详情

seajs实现javascript的模块开发及按模块加载

...eajs.org/docs/#docs　　首先看看seajs是怎么进行模块开发的。使用seajs基本上只有一个函数“define” fn.define=function(id,deps,f 查看详情

seajs：一个适用于web浏览器端的模块加载器(代码片段)

...SeaJS？假如我们要开发一个web应用App，在这个应用中需要使用jquery框架。App的首 查看详情

sea.js学习笔记

Sea.js入门http://www.cnblogs.com/doseoer/p/4007752.html前端模块化开发的价值随着互联网的飞速发展，前端开发越来越复杂。本文将从实际项目中遇到的问题出发，讲述模块化能解决哪些问题，以及如何使用Sea.js进行前端的模块化开发。htt... 查看详情

快速上手seajs——简单易用seajs

快速上手seajs——简单易用Seajs 原文  http://www.cnblogs.com/xjchenhao/p/4021775.html主题 SeaJS简易手册 http://yslove.net/seajs/ 背景一个网站必然会涉及很多功能，tab选项卡、slide轮播图、pop弹出层、美化alert、p 查看详情

seajs模块路径解析简单总结

seajs模块路径解析最近在试着用seajs+grunt改造现有项目，遇到的最大的问题就是seajs命名与调用，简单总结一下。模块调用seajs中调用模块有两种方式，seajs.use(ID)、require(ID)。ID命名完整绝对路径例如"http://example.com/test/js/jquery/jquery... 查看详情