seaJs模块化开发简单入门
随着前端技术的日益成熟,功能越来越丰富强大,规范也越来越健全,在这样的背景环境下很快便有了CommonJs、AMD、CMD等一系列规范,使前端发开趋向模块化、规范化。
CMD模块化的代表之一就是国内开发的seaJs,它有很多优点:
- 遵从CMD规范,代码模块化
- 中文文档通俗易懂,入门上手简单
- 兼容性好、配置简洁明了、提供插件接口
seajs模块化基本流程:
- 引入sea.js库
define
定义模块exports
暴露模块require
导入模块
安装
npm
安装npm i seajs
bower
安装bower i seajs
- 官网下载:http://seajs.org/docs/#downloads
定义模块
main.js
123456789101112define(function(require,exports,module){// 引用test.js//require('./test.js')/** 如果地址是一个模块,那么require的返回值就是模块中的exports*/function (){alert(require('./test.js').num);};// 向外暴露模块接口exports.alert = alert;})1) exports : 对外的接口
2) require : 依赖的接口test.js
1234define(function(require,exports,module){var num = 10;exports.num = num;});
调用模块
html页面中引入seajs和使用use方法请求入口文件
12345678910111213141516171819202122232425262728大专栏 seaJs模块化开发简单入门iv class="line"><html>
seaJs模块化开发简单入门的更多相关文章
- 初学seaJs模块化开发,利用grunt打包,减少http请求
原文地址:初学seaJs模块化开发,利用grunt打包,减少http请求 未压缩合并的演示地址:demo2 学习seaJs的模块化开发,适合对seajs基础有所了解的同学看,目录结构 js — —di ...
- 轻轻谈一下seaJs——模块化开发的利器
"仅做一件事,做好一件事." 这个应该就是seaJs的精髓了. 我在自己的一些项目中使用过seaJs.对其算是了解一二.如今就班门弄斧.轻轻地谈一下. 首先上一段度娘的话: &qu ...
- seajs模块化开发
seajs是一个起辅助作用的库,所以它可以更方便开发,而它可以解决以下问题: 1.命名问题,就是冲突 2.性能问题,就是只要一个功能,但却使用一个大插件中的一个小功能,所以要手动拆分出这个功能 3.j ...
- Java微信服务号的开发(简单入门)
进行微信服务号开发的步骤 一个别人已经搭建好的项目参考地址:下载链接 1.搭建微信服务号的服务器 项目配置maven <dependency> <groupId>com.soe ...
- flink--DateSet开发--简单入门
开发流程 1. 获得一个execution environment, 2. 加载/创建初始数据, 3. 指定这些数据的转换, 4. 指定将计算结果放在哪里, 5. 触发程序执行 例子: object ...
- 【翻译】WPF应用程序模块化开发快速入门(使用Prism+MEF)
编译并运行快速入门 需要在VisualStudio 2010上运行此快速入门示例 代码下载:ModularityWithMef.zip 先重新生成解决方案 再按F5运行此示例 说明: 在此快速入门示例 ...
- WindowsService开发简单入门
参考网址: https://www.cnblogs.com/wenlong512/p/7355971.html 一.简介 程序创建在 Windows 会话中,可长时间运行的可执行应用程序.这些服务可以 ...
- 2.精通前端系列技术之JavaScript模块化开发 seajs(一)
在使用seajs模块化开发之前,直接在页面引用js会容易出现冲突及依赖相关的问题,具体问题如下 问题1:多人开发脚本的时候容易产生冲突(比如全局参数冲突,方法名冲突),可以使用命名空间降低冲突,不能完 ...
- JS模块化开发(一)——seaJs
模块化开发要解决的问题: 1.冲突 比如:多人协作开发时,不同js库中的函数重名问题 可以用命名空间解决: var module={} module.a=1; module.b=function(){ ...
随机推荐
- HTTP知识整理
HTTP协议 HTTP协议的主要特点可概括如下: 1.支持客户/服务器模式. 2.简单快速:客户向服务器请求服务时,只需传送请求方法和路径.请求方法常用的有GET.HEAD.POST.每种方法规定了客 ...
- jquery选择器之获取父级元素、同级元素、子元素
一.获取父级元素 1. parent([expr]): 获取指定元素的所有父级元素 二.获取同级元素: 1.next([expr]): 获取指定元素的下一个同级元素 2.nextAll([expr]) ...
- 六、Shell脚本高级编程实战第六部
一.写一个start_nginx脚本,当启动.停止.重启时利用系统函数模拟实现系统脚本启动的特殊颜色效果 (用if实现) #!/bin/sh. /etc/init.d/functions if [ $ ...
- 利用docker安装gitlab
安装docker 安装 virtualbox 下载 dockertoolbox并安装 官网的服务器一直连不上, 幸亏还有这个 https://get.daocloud.io/toolbox/ 比 ht ...
- 搭建rocketmq
安装maven和java环境,此处省略.如果没有安装,请先安装maven和java环境!或者安装openjdk 首先下载rockermq官方地址:http://rocketmq.apache.org/ ...
- Monkey日常测试命令
一,LOG日志抓取 adb logcat -b main -v time >log.txt --实时日志打印 adb shell monkey -p com.eeyescloud.eeyes ...
- 如何使用 babel
babel-cli 在项目内运行 babel-cli 配置.babelrc 配置.jshintrc Babel 用于将 ES6 的代码转化为 ES5,使得 ES6 可以在目前的浏览器环境下使用.学习使 ...
- E. Alice and the Unfair Game(推导线段树)
题:https://codeforces.com/contest/1236/problem/E 粗自:https://www.cnblogs.com/YSFAC/p/11715522.html #in ...
- crm项目-stark组件分析
############### stark组件 ################ """ 这个stark组件是非常神奇的 1,独立的一个组件 2,没有mod ...
- @Transactional回滚问题(try catch、嵌套)
Spring 事务注解 @Transactional 本来可以保证原子性,如果事务内有报错的话,整个事务可以保证回滚,但是加上try catch或者事务嵌套,可能会导致事务回滚失败.测试一波. 准备 ...
- 初学seaJs模块化开发,利用grunt打包,减少http请求