RequireJS与SeaJS模块化加载示例

web应用越变的庞大，模块化越显得重要，尤其Nodejs的流行，Javascript不限用于浏览器，还用于后台或其他场景时，没有Class，没有 Package的Javascript语言变得难以管理，于是出现CommonJS项目，提出了一些规范模块化的写法，在Nodejs中普遍应用，同样浏览器端也出现了类似的解决方案，并结合浏览器异步加载的特性，有RequireJS提出的AMD（Asynchronous Module Definition）规范，以及SeaJS提出的CMD（Common Module Definition）规范，两者都实现Javascript了模块化定义的APIs，各有异同，下面将分别使用两种方案，实现Qunee组件的模块化加载

时间： 2024-10-13 09:28:13

RequireJS与SeaJS模块化加载示例的相关文章

SeaJS 模块化加载框架使用

SeaJS 是一个遵循 CMD 规范的模块化加载框架 CommonJS,CMD,AMD等规范后文会提到,这里主要先了解如何在代码中使用. 如果你有使用过nodejs ,那么理解起来就容易多了. 我们通过sea.js来加载我们定义的模块(这会儿遵循CMD规范)并使用相应的数据. 首先,当然是要下载sea.js,可以直接去http://seajs.org/docs/#downloads 直接下载代码包,解压后 在 /dist/目录下可以 找到 sea.js CMD规范是懒加载,按需加载,也就是在re

RequireJS 模块化加载框架使用

RequireJS 是一个遵循 AMD 规范的模块化加载框架 与上文seajs一样,这里简单介绍其相关用法 同样的,首先是下载好 require.js --> http://requirejs.org/docs/download.html#requirejs AMD规范是预加载,也就是说会马上将所有模块全加载. 写法跟seajs也类似,只不过 当需要包含模块时,一般会将模块名置入第一个参数.而不是直接require  详见 (新版本的也有CMD版require包含依赖的方式,但本质还是一样,下面

该如何理解AMD ，CMD，CommonJS规范--javascript模块化加载学习总结

是一篇关于javascript模块化AMD,CMD,CommonJS的学习总结,作为记录也给同样对三种方式有疑问的童鞋们,有不对或者偏差之处,望各位大神指出,不胜感激. 本篇默认读者大概知道require,seajs的用法(AMD,CMD用法),所以没有加入使用语法. 1.为何而生: 这三个规范都是为javascript模块化加载而生的,都是在用到或者预计要用到某些模块时候加载该模块,使得大量的系统巨大的庞杂的代码得以很好的组织和管理.模块化使得我们在使用和管理代码的时候不那么混乱,而且也方便了

再唠叨JS模块化加载之CommonJS、AMD、CMD、ES6

Javascript模块化编程,已经成为一个迫切的需求.理想情况下,开发者只需要实现核心的业务逻辑,其他都可以加载别人已经写好的模块. Javascript社区做了很多努力,在现有的运行环境中,实现"模块"的效果. CommonJS CommonJS定义的模块分为:  模块引用(require)    模块输出(exports)       模块标识(module) CommonJS Modules有1.0.1.1.1.1.1三个版本: Node.js.SproutCore实现了 Mo

seaJS 模块加载过程分析

先看一个seajs的官方example,  以下以seajs.use('main')为例, 解析加载mod main的过程 //app.html seajs.use("main"); //main.js define(function(require) { var Spinning = require('./spinning'); var s = new Spinning('#container'); s.render(); }); //spinning.js define(funct

echarts与TmodJS的冲突 -- 模块化加载器之间的冲突

前些日子写了一篇关于腾讯模板引擎TmodJS的文章<模板引擎artTemplate及模板预编译器TmodJS的使用入门>,算是对其原理与使用进行了初步的接触与研究.近期在一个项目中对TmodJS进行了尝试,未曾想无意中居然发现了TmodJS与百度图表神器Echarts之间存在一个看似不能共存的冲突. 问题是这样的:项目的某个页面中同时显式地引入了Echarts的主文件“echarts.js”以及TmodJS的依赖文件“require.js”.当执行到TmodJS所需的require()方法时,

如何构建一个微型的CMD模块化加载器

前言 前端模块化是一个老生常谈的话题,模块化的好处是不言而喻,比如易于代码复用.易于维护.易于团队开发d等云云.对于前端模块加载器,以前仅仅止步于会用的阶段,为了加深对前端模块化的理解,大概花了一周的时间来学习.调研并尝试自己实现一个简易版的符合CMD规范的加载器. 设计 加载器是按照CMD规范进行设计的,具体的CMD规范就不列出了,详情请见CMD规范. 入口函数 use(ids, callback) 模块定义函数 define(factory) 模块加载函数 require(id) 取得模块接

echarts模块化加载

第一代码部分:require.config({ paths: {echarts: '../js/dist'}}); require([ 'echarts', 'echarts/chart/line', 'echarts/chart/bar' ], function (ec) { mychart = ec.init(document.getElementById("LineChart"));                                                v

[Asp.NET MVC+EasyUI] TreeGrid全部加载及懒加载示例

本篇文主要对EasyUI中TreeGrid组件的使用进行演示.对于正在学此组件的童鞋,不防花个几分钟看一下.本文主要演示:TreeGrid的简单应用.懒加载方法.控件数据格式. TreeGrid组件是由DataGrid集成而来,可以使行与行之间存在父子关系,是一种树形网格组件. 1. 创建简单示例 通过post方式调用后端数据,将数据展示到前端,具体代码如下: 1.1 前端代码 <html xmlns="http://www.w3.org/1999/xhtml"> <