为什么我们要使用requir.js呢
在我们写页面的时候js的时候通常简简单单的页面都要引入好几个js文件甚至大项目要引入十几个几十个,通常会很乱也不好维护
优点
1.模块化方便管理
2.压缩
缺点(其实也说不上缺点)
1.小公司,不会自己去开发前端插件,而都是拿来插件就用的
2.非nodejs开发,或非游戏开发…
我们开始require.js的使用吧
一、
1)首先我们肯定要引入require.js文件
2)设置一个属性data-main
它的值是一个js文件的路径(就是你要实现模块的那个js)
data-main属性的作用:就是设置该模块的入口文件
comment.js就是我要实现模块的js文件,所以我引入它
二、
// 1.配置模块
require.config({
// 1.1申明模块
// 申明你要引入的js文件
paths : {
// 对象的方式 键值对 键名字 值是路径 (路径最后面不能带.js)
// 名字可以随便取 最好是有语义化
"jq" : "jquery/jquery",
"template" : "art-template/template-web",
"base" : "base",
"index" : "index",
"bootstrap" : "bootstrap/js/bottstrap"
},
// 1.2声明js之间的依赖关系
// 比如 我要引入base.js 但是我还需要bootstrap
// 如果一个依赖多个js就在["","",""....]这样的形式关联
shim : {
"base" : {
// deps声明该模块依赖哪些模块
deps : ["bootstrap"]
},
"index" : {
deps : ["jq", "base", "bootstrap"]
}
}
});
// 2.引入模块
// 使用require.js的一个函数来实现
// 函数require(模块的数组,实现功能的回调函数) ----回调到函数参数要和模块数组一一对应
// 模块数组中的每个模块的名字是从paths声明的时候拿到的
require(["jq", "template", "base", "index", "bootstrap"], function($,template,base,index, bootstrap) {
$(function() {
// 这里面就是你要实现功能的地方
// 名字你是哪个模块就使用哪个模块
console.log(1);
})
});
这是个人的使用方法 如果有错误还请君在下方评论
想看更多请看我的博客