模块化开发RequireJS之shim配置
shim配置语法为:
//配置文件
requirejs.config({
baseUrl: 'js', //默认是main.js所在的文件夹为基准。
paths: {
jquery: 'jquery-1.12.4.min' //起个别名
},
//关键配置
shim: {
//配置方式一:jQuery.CateNav为模块名称,jquery为依赖的js模块
//'jQuery.CateNav': ['jquery'] //配置方式二:jQuery.CateNav为模块名称,deps为配置依赖的js模块,deps数组,表明该模块的依赖性
'jQuery.CateNav': {
deps: ['jquery'],
exports: "CateNav"
}
}
}); //加载入口模块
requirejs(['index']); //从基准路径js下开始查找index.js
二、示例
具体代码示例参考我的github地址:
https://github.com/MengFangui/require-shim/tree/master
示例代码为基于jquery的锚点滚动效果的插件,这个插件是我基于jQuery开发(未采用AMD规范),组件地址为:
http://www.cnblogs.com/mengfangui/p/7428500.html
示例代码实现了模块化开发中非AMD规范的js的加载。
模块化开发RequireJS之shim配置的更多相关文章
- 模块化开发(requireJS)
模块化 在前端使用模块化开发,可以将代码根据功能实施模块的划分,每个模块功能(职责)单一,在需要更改对应的功能的时候,只需要对指定的模块进行修改,其他模块不受任何影响. 为什么要进行前端模块化? 达到 ...
- 模块化开发RequireJS之路径解析
1.requirejs遵循AMD规范,将需要的都加载好(前置加载).注:cmd是就近加载. define(['jQuery','dialog'],function($,d){ // 业务逻辑 }) ( ...
- Vue-Router路由 Vue-CLI脚手架和模块化开发 之 路由常用配置与路由嵌套
vue-router路由常用配置 1.mode:配置路由模式,默认为hash,由于URL很丑,可以修改为history,但是需要服务端的支持: 以上一篇的博文为实例: 初始时url的显示: 使用mod ...
- [工具配置]使用requirejs模块化开发多页面一个入口js的使用方式
描述 知道requirejs的都知道,每一个页面需要进行模块化开发都得有一个入口js文件进行模块配置.但是现在就有一个很尴尬的问题,如果页面很多的话,那么这个data-main对应的入口文件就会很多. ...
- 在Html中使用Requirejs进行模块化开发
在前端模块化的时候,不仅仅是js需要进行模块化管理,html有时候也需要模块化管理.这里就介绍下如何通过requirejs,实现html代码的模块化开发. 如何使用requirejs加载html Re ...
- 【模块化开发】------requireJS的基本使用------【巷子】
前言 为了提高代码的复用度,开发人员会按照功能把大量的js代码分成若干文件,这样在多个页面就可以使用同一个文件了.,下面是某个网站的js引用情况 虽然代码的复用度提升了,但是缺点也体现了出来 缺点: ...
- 使用requirejs模块化开发多页面一个入口js的使用方式
描述 知道requirejs的都知道,每一个页面需要进行模块化开发都得有一个入口js文件进行模块配置.但是现在就有一个很尴尬的问题,如果页面很多的话,那么这个data-main对应的入口文件就会很多. ...
- Javascript模块化开发,使用模块化脚本加载工具RequireJS,提高你代码的速度和质量。
随着前端JavaScript代码越来越重,如何组织JavaScript代码变得非常重要,好的组织方式,可以让别人和自己很好的理解代码,也便于维护和测试.模块化是一种非常好的代码组织方式,本文试着对Ja ...
- Angular 结合RequireJs实现模块化开发
angular的指令是模块化很好的一个体现,下面我将只使用指令(不用控制器),结合requirejs,实现模块化开发. 模块化关系图:
随机推荐
- Spring学习的切入点
spring是个顶级的框架,这话没毛病.很多人想把它征服,想去阅读它的源码,弄懂它的设计思想,从中学到精粹. 但是很多次打开后,看到庞大的体系结构,就懵逼了,不知从何入手. 我在这里总结下学习spri ...
- D - Matrix Multiplication ZOJ - 2316 规律题
Let us consider undirected graph G = which has N vertices and M edges. Incidence matrix of this grap ...
- css-移动&缩放元素
transform 属性向元素应用 2D 或 3D 转换.该属性允许我们对元素进行旋转.缩放.移动或倾斜. 用法:object.style.transform="rotate(7deg)&q ...
- [POJ3728]The merchant
题目大意: 给你一棵n个结点的带权树,有q组询问,问你从u到v的路径上最大值与最小值的差(最大值在最小值后面). 思路: 首先考虑路径上合并两个子路径u->t和t->v时的情况. 假设我们 ...
- Unity3D 粒子系统
我们先来看看Particle System在Inspector视窗中的属性: 1.Transform:可以控制粒子在世界或者本地坐标的改变.但是有点注意的是,如果你改变Scale属性值是不会影响粒子的 ...
- PHP温故知新(一)
前言 开发PHP也有几年的时间了,记得第一次接触PHP那时候还是PHP4,现在PHP版本已经是7了,虽然本人也算是一个PHP老手了,但是总觉得有些基础知识掌握的不是很好.学PHP之初只是为了混口饭吃, ...
- 虚拟PDF打印机
doPDF虚拟打印机 doPDF 是一个免费的PDF转换器,可同时运用于商业和个人,它把自己安装为一个打印机驱动,允许从任意一个有打印输出的Windows程序中打印,还包含缩放,质量定义和页面大小定义 ...
- 一劳永逸的搞定 flex 布局
一劳永逸的搞定 flex 布局 寻根溯源话布局 一切都始于这样一个问题:怎样通过 CSS 简单而优雅的实现水平.垂直同时居中.记得刚开始学习 CSS 的时候,看到 float 属性不由得感觉眼前一亮, ...
- 如何在sublime3项目设置中设置python模块的搜索路径?ImportError: No module named *的解决办法
问题:之前使用pycharm,用的挺溜,但是电脑配置实在不争气,pycharm启动久了,耗去大量内存,导致运行起来越来越慢,于是转向使用sublime text. 把项目从pycharm切换到subl ...
- sql 改动表以及表字段
用SQL语句加入删除改动字段 1.添加字段 alter table docdsp add dspcode char(200) alter table tbl add meet ...