您的位置：首页 > Web前端 > JavaScript

javascript代码模块化Demo（使用Require.js）

2016-05-06 11:07 579 查看

Demo目录结构：

index.html：

<!DOCTYPE html>
<html>
<head>
<title>使用Require.js</title>
<meta charset="UTF-8">

<script src="js/lib/require.js" defer async="true"></script>
<script src="js/lib/require.js" data-main="js/index"></script>
</head>
<body>
<p class="message">哈哈哈哈哈</p>
</body>
</html>

index.js：

require.config({
paths: {
"jquery": "lib/jquery"
}
});

require(['jquery', 'moudle1'], function ($, moudle1) {
moudle1.showAlert('这是我写的模块喔');

$('.message').text('我很开心！');
});

moudle1.js：

define(function(){
var showAlert = function(str){
alert(str);
};

return {
showAlert: showAlert
};
});

request.js 下载地址：http://requirejs.org/docs/download.html

注：下载Require.js文件的时候下载压缩版，不然的话下面代码会失效，Require.js找不到index.js文件，只会到根目录去找index.js文件。这个应该是Require.js的Bug。

data-main="js/index"

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航