利用require.js实现javascript模块化加载
这种引入很看到很想死吧!
<script src="1.js"></script>
<script src="2.js"></script>
<script src="3.js"></script>
<script src="4.js"></script>
<script src="5.js"></script>
<script src="6.js"></script>
require.js可以很好的优化这个问题:
1、下载require.js http://requirejs.org/docs/download.html
2、用法
如果放底部
<script src="js/require.js"></script>
如果放头部
<script src="js/require.js" defer async="true" ></script>
指定主程序为main.js
<script src="js/require.js" data-main="js/main"></script>
3、主模块写法
// main.js
require(['moduleA', 'moduleB', 'moduleC'], function (moduleA, moduleB, moduleC){
// some code here
});
原来的:
<!DOCTYPE html>
<html lang="zh-cn">
<head>
<title>html</title> </head>
<body> <script type="text/javascript" src="js/m1.js"></script>
<script type="text/javascript" src="js/m2.js"></script>
<script type="text/javascript" src="js/m3.js"></script>
<script type="text/javascript" src="js/m4.js"></script>
</body>
</html>
就可以改为:
<!DOCTYPE html>
<html lang="zh-cn">
<head>
<title>html</title> </head>
<body> <script src="js/require.js" data-main="js/main"></script>
</body>
</html>
//main.js
require(['m1','m2','m3','m4'],function(m1,m2,m3,m4){ });
利用require.js实现javascript模块化加载的更多相关文章
- 该如何理解AMD ,CMD,CommonJS规范--javascript模块化加载学习总结
是一篇关于javascript模块化AMD,CMD,CommonJS的学习总结,作为记录也给同样对三种方式有疑问的童鞋们,有不对或者偏差之处,望各位大神指出,不胜感激. 本篇默认读者大概知道requi ...
- 实现一个JavaScript模块化加载器
对任何程序,都存在一个规模的问题,起初我们使用函数来组织不同的模块,但是随着应用规模的不断变大,简单的重构函数并不能顺利的解决问题.尤其对JavaScript程序而言,模块化有助于解决我们在前端开发中 ...
- JavaScript 模块化加载
存在AMD(Asynchronous Module Definition异步模块定义)规范和CMD(Common Module Definition通用模块定义)规范.对于依赖的模块,AMD是提前执行 ...
- webpack中利用require.ensure()实现按需加载
webpack中的require.ensure()可以实现按需加载资源包括js,css等,它会给里面require的文件单独打包,不和主文件打包在一起,webpack会自动配置名字,如0.js,1.j ...
- 应用require.js进行javascript模块化编程小试一例
长久以来都渴望应用javascript的模块化编程.今日紧迫更甚,岁月蹉跎,已经不能再等了. 拜读阮一峰的有关文章已经好几遍,文章写得真好,简洁流畅,头头是道,自觉有点明白了.但经验告诉我们,一定要亲 ...
- 再唠叨JS模块化加载之CommonJS、AMD、CMD、ES6
Javascript模块化编程,已经成为一个迫切的需求.理想情况下,开发者只需要实现核心的业务逻辑,其他都可以加载别人已经写好的模块. Javascript社区做了很多努力,在现有的运行环境中,实现” ...
- require.js模块化管理和加载js(按需加载)简单实例教学
一.为什么要用require.js? 最早的时候,所有Javascript代码都写在一个文件里面,只要加载这一个文件就够了.后来,代码越来越多,一个文件不够了,必须分成多个文件,依次加载.下面的网页代 ...
- js模块化加载器实现
背景 自es6以前,JavaScript是天生模块化缺失的,即缺少类似后端语言的class, 作用域也只以函数作为区分.这与早期js的语言定位有关, 作为一个只需要在网页中嵌入几十上百行代码来实现一些 ...
- 【 js 模块加载 】深入学习模块化加载(node.js 模块源码)
一.模块规范 说到模块化加载,就不得先说一说模块规范.模块规范是用来约束每个模块,让其必须按照一定的格式编写.AMD,CMD,CommonJS 是目前最常用的三种模块化书写规范. 1.AMD(Asy ...
随机推荐
- HDU 6186 CS Course 前缀和,后缀和
题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=6186 题意:给了n个数,然后有q个查询,每个查询要求我们删掉一个数,问删掉这个数后整个序列的与值,或值 ...
- web优化的方法
缓存(减小对服务器.数据库的压力) 生成静态页面(区别于缓存,数据量太大用“缓存”不利) URL重写(SEO,搜索引擎的优化) ajax的优化(SEO) <meta content=“” nam ...
- 系统调用wait()
进程一旦调用了 wait,就 立即阻塞自己,由wait自动分析是否当前进程的某个子进程已经退出,如果让它找到了这样一个已经变成僵尸的子进程,wait 就会收集这个子进程的信息, 并把它彻底销毁后返回: ...
- tornado 模版
tornado 模版语法 取消转义 : 取消项目转义 :autoescape = None 取消模版转义:{% autoescape None %} 取消行转义 :{% raw bd %} 强制转 ...
- C#ActiveX控件开发
1.新建项目,选择C#,选择.NET Framework2.0,新建一个Windows窗体控件库项目,命名为ActiveXDemo; 2.右击ActiveXDem项目,选择属性——应用程序——程序集信 ...
- [转]6个HelloWorld
原文地址:点击打开链接 转这个帖子,是因为看了这个帖子使我明白了一个道理:一旦你发散自己的思维,激发自己的创意,就会发现原来编程是这么的好玩. 原文标题为<6个变态的C语言Hello World ...
- spring cloud报错解决:java.lang.ClassNotFoundException: com.netflix.servo.monitor.Monitors
见鬼的事发生了. 在家里电脑上拿样例代码,运行时OK的.但一到公司电脑,用同样的代码,就会报下面的错误 ===================== Caused by: java.lang.Class ...
- cocos2d-x addImageAsync()异步加载资源成功之后的场景跳转问题
http://blog.csdn.net/w20175357/article/details/23546985 1.先说说addImageAsync()异步加载图片的问题 做游戏的时候现在资源的比较大 ...
- 剑指offer-判断是否是平衡二叉树
private boolean isBalanced = true; public boolean IsBalanced_Solution(TreeNode root) { height(root); ...
- 洛谷P3690 [模板] Link Cut Tree [LCT]
题目传送门 Link Cut Tree 题目背景 动态树 题目描述 给定n个点以及每个点的权值,要你处理接下来的m个操作.操作有4种.操作从0到3编号.点从1到n编号. 0:后接两个整数(x,y),代 ...