开始学习requirejs+easyui的使用.
开始学习requirejs+easyui的使用.
目录结构:
|-project
|-easyui01
|-js
|-main.js
|-index.html
|-libs
libs目录下放入的是easyui和require.js . jquery包含在easyui中.
自己写的代码就index.html和main.js 如下:
index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>easyui+requirejs+demo[1]</title>
<link rel="stylesheet" href="../libs/easyui/themes/default/easyui.css">
<link rel="stylesheet" href="../libs/easyui/themes/icon.css">
</head>
<body>
<p>(1)shim: shim参数解决了使用非AMD方式定义的模块(如jQuery插件)及其载入顺序.</p>
<p>(2)easyui的easyui-lang-zh_CN.js也是依赖jquery的.</p>
<p>
(3)easyui是jquey的插件,使用'$'就可以访问到easyui,但是编码时仍然需要引入.例如:
require(['jquery','zhCN','easyui'], function($,zhCN,easyui){});
</p>
<p>
(4)easyui必需的css文件要自行导入在html页面中.
如: link rel="stylesheet" href="../libs/easyui/themes/default/easyui.css"
</p>
<script src="../libs/require.js" data-main="js/main"></script>
</body>
</html>
main.js
require.config({
//baseUrl: 'js',
shim: {
//easyui-lang-zh_CN.js也依赖jquery
'zhCN': ['jquery'],
'easyui': ['jquery']
},
paths: {
//引入的js文件不需要带入后缀'.js'
jquery: '../../libs/easyui/jquery.min',
easyui: '../../libs/easyui/jquery.easyui.min',
zhCN: '../../libs/easyui/locale/easyui-lang-zh_CN'
}
});
//require(['easyui']);
require(['jquery','zhCN','easyui'], function($,zhCN,easyui){
console.log($().jquery);
//
$.messager.alert('提示','hello,world!');
});
总结:
(1)shim: shim参数解决了使用非AMD方式定义的模块(如jQuery插件)及其载入顺序.
(2)easyui的easyui-lang-zh_CN.js也是依赖jquery的.
(3)easyui是jquey的插件,使用'$'就可以访问到easyui,但是编码时仍然需要引入.例如: require(['jquery','zhCN','easyui'], function($,zhCN,easyui){});
(4)easyui必需的css文件要自行导入在html页面中. 如: link rel="stylesheet" href="../libs/easyui/themes/default/easyui.css"
开始学习requirejs+easyui的使用.的更多相关文章
- EasyUI学习(一)——EasyUI入门
EasyUI学习总结(一)——EasyUI入门 一.EasyUI下载 EasyUI官方下载地址:http://www.jeasyui.com/download/index.php,目前最新的版本是:j ...
- 作为新手在学习SSM+Easyui过程中遇到一系列问题
对于初学SSM来说,如果不熟悉SSM中SpringMVC对数据处理,会造成很大的困扰, SSM中对前台页面放在WEB-INF下,对于读取外部信息,例如导入easyui的js文件.以及不能直接进行跳转. ...
- 【requireJS源码学习03】细究requireJS的加载流程
前言 这个星期折腾了一周,中间没有什么时间学习,周末又干了些其它事情,这个时候正好有时间,我们一起来继续学习requireJS吧 还是那句话,小钗觉得requireJS本身还是有点难度的,估计完全吸收 ...
- jQuery EasyUI学习资源汇总
jQuery EasyUI学习资源汇总 EasyUi – 1.入门 EasyUi – 2.布局Layout + 3.登录界面 EasyUi – 4.datwagrid 学习Jquery EasyUI的 ...
- easyUI 学习
)省份-城市-区域三级联动[struts2 + ajax +非数据库版] (1)省份-城市-区域,基于jQuery的AJAX三级联动,用Struts2整合AJAX[非数据库版] $.ajax( { t ...
- 浅谈requireJS
项目中大都使用模块化开发,requireJS作为AMD模块开发的典范,所以有必要学习下.通过一步步利用requireJS编写demo,从而学习requireJS的一个整体开发流程以及自我使用requi ...
- 第 1 章 jQuery EasyUI 入门
学习要点: 1.什么是 jQuery EasyUI 2.学习 jQuery EasyUI 的条件 3.jQuery EasyUI 的功能和优势 4.其他的 UI 插件 5.是否兼容低版本 IE 6.下 ...
- RequireJS入门之一——实现第一个例子
为什么学习RequireJS? 像我这种菜鸟,会提到海量文章里提到的AMD.JS模块化编程.异步... ... 等等 RequireJS是一个Javascript 文件和模块框架,它可以帮我们去管理j ...
- 使用 RequireJS 优化 Web 应用前端
基于 AMD(Asynchronous Module Definition)的 JavaScript 设计已经在目前较为流行的前端框架中大行其道,jQuery.Dojo.MooTools.EmbedJ ...
随机推荐
- 改进的SMO算法
S. S. Keerthi等人在Improvements to Platt's SMO Algorithm for SVM Classifier Design一文中提出了对SMO算法的改进,纵观SMO ...
- H.264 Profile、Level、Encoder三张简图 (fps = AVCodecContext->time_base.den / AVCodecContext->time_base.num)
H.264 Profiles Profiles are sets of capabilities. If your black box only supports the Baseline profi ...
- openstack 制作大于2TB根分区自动扩容的CENTOS镜像
制作镜像的时候默认分的是30G空间 qemu-img create -f raw centos.img 30G 看官网文档安装完系统需要安装cloud-init和clout-utils包,本人安装了完 ...
- 分布式定时任务框架比较,spring batch, tbschedule jobserver
分布式定时任务框架比较,spring batch, tbschedule jobserver | 移动开发参考书 分布式定时任务框架比较,spring batch, tbschedule jobser ...
- 数据绑定之DataFormatString
设定BoundField的DataFormatString,通常有以下几种 DataFormatString= "{0:C}" 货币,货币的格式取决于当前Thread中Cultur ...
- Git学习资料
1.http://wuyuans.com/2012/05/github-simple-tutorial/ 2.http://www.ihref.com/read-16369.html
- IP地址的分类——a,b,c 类是怎样划分的
如今的IP网络使用32位地址,以点分十进制表示,如172.16.0.0.地址格式为:IP地址=网络地址+主机地址 或 IP地址=主机地址+子网地址+主机地址. IP地址类型 最初设计互联网络时,为了便 ...
- navicate恢复数据
恢复psc文件,出现记录数为0 不要使用事务,选用遇到错误继续
- gulp自己主动化任务脚本在HybridApp开发中的使用
眼下做前端开发的同学可能都熟悉grunt.fis之类的自己主动化构建工具.事实上在HybridApp开发中我们也能够使用这些工具来简化我们的工作.gulp就是一个比grunt,fis都先进的构建工具. ...
- [Ember] Creating Your First Ember.js Project with Ember-CLI
In this lesson, we'll setup Ember-CLI and use it to create and run our first Ember.js project. Insta ...