使用seajs进行模块管理

saucxs 发布于2019-08-19 17:36 / 1830人阅读

摘要：一类是以国内的等类库为代表的大教堂模式。在大教堂模式下，所有组件都是颗粒化模块化的，各组件之间层层分级环环相扣。在集市模式下，所有组件彼此独立职责单一，各组件通过组合松耦合在一起，协同完成开发兼容性持续更新中。。。

前端模块化开发的价值 解决命名冲突

我们做项目是常常会做一些通用功能的封装,封装成一个个的函数,然后保存在一个名叫util.js的文件中.这种情况就很有可能在另一个开发人员开发时发生命名冲突.

解决繁琐的文件依赖

基于util.js，我们开始开发UI层通用组件dialog.js,那么我们现在的引用情况应该这样:

假如有更多的依赖关系引用起来就非常的繁琐.

使用Sea.js来解决

seajs是一个模块管理框架,使用seajs需要遵守CMD(Common Module Definition)模块定义规范.一个文件就是一个模块.

通过define函数进行模块定义.

util.js文件的代码如下:

define(function(require,exports){
    exports.each = function(){
        //实现代码
    };
    esxports.log = function(str){
        //实现代码
    }
});

这里的exports向外提供了each和log方法,当这个模块被引用时,可以调用这两个方法.

通过require函数进行模块调用.

dialog.js文件的代码如下:

define(function(require,exports){
    var util = require("./util.js");
    exports.init = function(){
        util.each();
        util.log();
    }
});

这里通过require("./util.js")来调用到util模块.

Sea.js 带来的好处

通过exports暴露接口.这意味着不需要命名空间,也不需要全局变量,解决了命名冲突的问题.

通过require引入依赖.这是一种很好的关注分离，解决了繁琐的文件依赖.

模块的版本管理.通过别名等配置,配合构建工具,可以比较轻松的实现模块的版本管理.

提升可维护性. 模块化可以让每个文件的职责单一,非常利于代码维护.seajs提供nocahce debug等插件,拥有在线调试等功能,能比较明显的提升效率.

前端性恶能优化.seajs通过异步加载模块对页面性能非常有益.seajs提供了combo flush插件，配合服务端,可以很好对页面性能进行调优.

跨环境共享模块.CMD模块定义规范与NOdejs的模块规范非常相近.通过seajs的Nodejs版本,可以很方便实现模块的跨服务器和浏览器共享.

前端的模块化构建可分为两大类。一类是以 Dojo、YUI3、国内的 KISSY 等类库为代表的大教堂模式。在大教堂模式下，所有组件都是颗粒化、模块化的，各组件之间层层分级、环环相扣。另一类是以 jQuery、RequireJS、国内的 Sea.js、OzJS 等类库为基础的集市模式。在集市模式下，所有组件彼此独立、职责单一，各组件通过组合松耦合在一起，协同完成开发.

seajs兼容性

Chorme 3+

Firfox 2+

Safari 3.2+

Opera 10+

IE 5.5+

持续更新中。。。

GPU云服务器云服务器 seajs模块如何使用云服务器进行分配如何使用云服务器进行游戏静态资源使用cdn进行服务分发

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/78672.html

sea.js

摘要：目标了解目前公司所用得代码模块式开发。比较目前比较流行得框架。模块化可以让每个文件的职责单一，非常有利于代码的维护。模块定义规范与的模块规范非常相近。一类是以国内的等类库为代表的大教堂模式。目标：1.了解目前公司所用得sea.js,代码模块式开发。 2.比较目前比较流行得bootstrap,angularJS,reactJS框架。参考：http://seajs.org/docs/...

renweihub 2019-08-19 17:48 评论0 收藏0
前端seajs模块化实践

摘要：前端模块化开发的价值恼人的命名冲突烦琐的文件依赖使用来解决除了解决命名冲突和依赖管理，使用进行模块化开发还可以带来很多好处模块的版本管理。模块化可以让每个文件的职责单一，非常有利于代码的维护。模块定义规范与的模块规范非常相近。前端模块化开发的价值1、恼人的命名冲突2、烦琐的文件依赖使用 Sea.js 来解决除了解决命名冲突和依赖管理，使用 Sea.js 进行模块化开发还可以带来很多好...

SHERlocked93 2019-08-22 16:06 评论0 收藏0
再谈JavaScript模块化

摘要：应用日益复杂，模块化已经成为一个迫切需求。异步模块加载机制。引用的资源列表太长，懒得回调函数中写一一对应的相关参数假定这里引用的资源有数十个，回调函数的参数必定非常多这就是传说中的简述缘起模块通常是指编程语言所提供的代码组织机制，利用此机制可将程序拆解为独立且通用的代码单元。模块化主要是解决代码分割、作用域隔离、模块之间的依赖管理以及发布到生产环境时的自动化打包与处理等多个方面...

MorePainMoreGain 2019-08-26 10:14 评论0 收藏0
前端模块化开发

摘要：来源于阿贤博客模块化今天给大家写一篇关于前端模块化开发知识点。前端模块化开发那点历史模块化是指在解决某个复杂混杂问题时，依照一种分类的思维把问题进行系统性的分解以之处理。来源于：阿贤博客 javascript模块化今天给大家写一篇关于前端模块化开发知识点。前端模块化开发那点历史模块化：是指在解决某个复杂、混杂问题时，依照一种分类的思维把问题进行系统性的分解以之处理。模块...

tianhang 2019-08-23 16:44 评论0 收藏0
JavaScript模块化发展

摘要：所有依赖这个模块的语句，都定义在一个回调函数中，等到所有依赖加载完成之后前置依赖，这个回调函数才会运行。如果将前面的代码改写成形式，就是下面这样定义了一个文件，该文件依赖模块，当模块加载完毕之后执行回调函数，这里并没有暴露任何变量。模块化是我们日常开发都要用到的基本技能，使用简单且方便，但是很少人能说出来但是的原因及发展过程。现在通过对比不同时期的js的发展，将JavaScript模...

mengbo 2019-08-22 18:05 评论0 收藏0