requirejs(模块化)

<script src="../../dist/js/require.js" data-main="../../dist/js/main.js"></script>
main.js:
requirejs.config({
  paths: {
    jquery: 'plugins/jQuery/jquery-2.2.3.min',
    icheck: 'plugins/iCheck/icheck.min'
  }
});
requirejs(['jquery','icheck'],function($) {
  $('.checkLine').iCheck({
    checkboxClass: 'icheckbox_flat-blue',
    radioClass: 'icheckbox_flat-blue',
  });
});

require.config({

    baseUrl: "js/lib",改变基目录

    paths: {

      "jquery": "jquery.min",
      "underscore": "underscore.min",
      "backbone": "backbone.min"

    }

  });

 http://www.ruanyifeng.com/blog/2012/11/require_js.html
http://www.requirejs.cn/
 
https://gitee.com/qiaozh/codes/coamv6il59gw3n0kp421x49
 
所谓的模块化:将一个个函数封装在一个对象里,再将该对象赋值给一个全局变量
(function($){
var courseObj = {
  name:'笑话',
  set:function(){
  },
  openCourseBook:function(){
  },
  printCourse:function(){
  }
};
  window.courseService = courseObj;
})(jQuery || {})
var courseService = (function($){
var courseObj = {
  name:'笑话',
  set:function(){
  },
  openCourseBook:function(){
  },
  printCourse:function(){
  }
};
   return courseObj;
})(jQuery || {})
 
当出现依赖关系:(缺陷:引入时被调用的需要放在前面)
<script src="./courseSkin.js"></script>
<script src="./courseTable.js"></script>
courseSkin.js:
(function($){
  var skin = {
  name:'ccc',
  get:function(){
    alert(this.name);
  }
};
window.courseSkin = skin;
})(jQuery || {})
courseTable.js:
(function($,courseSkin){
var courseObj = {
  name:'笑话',
  set:function(){
    alert(this.name);
  },
  openCourseBook:function(){
    courseSkin.get();//调用courseSkin
  },
  printCourse:function(){
    alert("printCourse");
  }
};
window.courseService = courseObj;
})(jQuery || { },courseSkin)
posted @ 2019-01-15 15:08  雨夜稻草  阅读(144)  评论(0编辑  收藏  举报