码迷,mamicode.com
首页 > 编程语言 > 详细

利用require.js实现javascript模块化加载

时间:2015-10-30 12:39:01      阅读:188      评论:0      收藏:0      [点我收藏+]

标签:

这种引入很痛苦吧,

<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模块化加载

标签:

原文地址:http://www.cnblogs.com/tinyphp/p/4922768.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!