您的位置:首页 > 产品设计 > UI/UE

第3.1.2章 WEB系统最佳实践 js控件之requirejs的使用

2016-11-07 13:39 621 查看
requirejs配置说明参考RequireJS进阶:配置文件的学习requirejs官网

requirejs.config({
baseUrl:ctxResources+'/pages/modules',
urlArgs: "v=" +  (new Date()).getTime(),//禁止缓存,生产环境去除
//  urlArgs:'v=2016122104',
paths:{
jquery:["../../plugins/jquery/jquery"],
jdirk:["../../plugins/jquery/jquery.jdirk.min"],
bootstrap:["../../plugins/bootstrap/dist/js/bootstrap.min"],
validate:["../../plugins/bootstrapvalidator/js/bootstrapValidator"],
validate_zh:['../../plugins/bootstrapvalidator/js/language/zh_CN'],
toastr:["../../plugins/toastr/toastr.min"],
md5:["../../plugins/udf/md5"],
layer:["../../plugins/layer/layer"],
spin:["../../plugins/ladda-bootstrap/dist/spin.min"],
ladda:["../../plugins/ladda-bootstrap/dist/ladda"],
template:["../../plugins/artTemplate/template"],
slimscroll:["../../plugins/slimscroll/jquery.slimscroll.min"],
bootstrap_table:["../../plugins/bootstrap-table/dist/bootstrap-table"],
bootstrap_table_zh:["../../plugins/bootstrap-table/dist/locale/bootstrap-table-zh-CN.min"],
bootstrap_table_edit:["../../plugins/bootstrap-table/dist/extensions/editable/bootstrap-table-editable"],
editable:['../../plugins/bootstrap-table/dist/extensions/editable/bootstrap-editable'],
constant:["../../plugins/udf/constant"],
touchspin:["../../plugins/bootstrap-touchspin/jquery.bootstrap-touchspin.min"],
util:["../../plugins/udf/util"],
chosen:["../../plugins/chosen/chosen.jquery.min"],
dzmcombo:["../../plugins/udf/dzmcombo"],
datepicker:["../../plugins/bootstrap-datepicker/dist/js/bootstrap-datepicker.min"],
datepicker_zh:["../../plugins/bootstrap-datepicker/dist/locales/bootstrap-datepicker.zh-CN.min"],
global:["../../plugins/udf/global"],
jasny:["../../plugins/jasny-bootstrap/js/jasny-bootstrap.min"],
bootstrap_switch:["../../plugins/bootstrap-switch/js/bootstrap-switch.min"],
bootstrap_suggest:["../../plugins/bootstrap-suggest-plugin/bootstrap-suggest.min"],
bootstrap_table_json:["../../plugins/bootstrap-table/dist/extensions/json/bootstrap-table-json"],
ztree:["../../plugins/ztree/js/jquery.ztree.all"],
},
shim:{
jdirk:{deps: ["jquery"],exports: 'jdirk'},
bootstrap: {deps: ["jquery"],exports: 'bootstrap'},
validate: {deps: ["jquery"],exports: 'validate'},
validate_zh:{deps: ["jquery","validate"],exports: 'validate_zh'},
toastr: {deps: ["jquery","css!../../plugins/toastr/toastr.min.css"],exports: "toastr"},
md5: {exports: 'md5'},
layer:{deps:["jquery","css!./../../plugins/layer/skin/layer.css"],exports:'layer'},
ladda:{deps:["spin","css!../../plugins/ladda-bootstrap/dist/ladda-themeless.min.css"],exports:"ladda"},
template:{exports:"template"},
slimscroll:{deps:["jquery"],exports:"slimscroll"},
bootstrap_table:{deps:["jquery"],exports:"bootstrap_table"},
bootstrap_table_zh:{deps:["jquery","bootstrap_table","css!../../plugins/bootstrap-table/dist/bootstrap-table.min.css"],exports:"bootstrap_table_zh"},
touchspin:{deps:["jquery","css!./../../plugins/bootstrap-touchspin/jquery.bootstrap-touchspin.min.css"]},
chosen:{deps:["jquery","css!./../../plugins/chosen/chosen.min.css"]},
datepicker:{deps:["jquery",'css!./../../plugins/bootstrap-datepicker/dist/css/bootstrap-datepicker.css'],exports:"datepicker"},
datepicker_zh:{deps:["jquery","datepicker"],exports:"datepicker_zh"},
jasny:{deps:["jquery","css!./../../plugins/jasny-bootstrap/css/jasny-bootstrap.min.css"],exports:"jasny"},
bootstrap_switch:{deps:["jquery","css!./../../plugins/bootstrap-switch/css/bootstrap3/bootstrap-switch.min.css"],exports:"bootstrap_switch"},
bootstrap_suggest:{deps:["jquery"],exports:"bootstrap_suggest"},
bootstrap_table_json:{deps:["bootstrap_table_zh"],exports:"bootstrap_table_json"},
editable:{deps:["jquery"],exports:"editable"},
bootstrap_table_edit:{deps:["bootstrap_table_zh","editable","css!./../../plugins/bootstrap-table/dist/extensions/editable/bootstrap-editable.css"],exports:"bootstrap_table_edit"},
ztree:{deps:["jquery","css!./../../plugins/ztree/css/metroStyle/metroStyle.css"],exports:"ztree"}
},
map:{
'*':{
css:'../../plugins/requirejs/css'
}
}
});
require(['jquery','bootstrap','global','layer']);


这里简单描述一下css的异步加载用到了下面的js。

require css
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签:  requirejs
相关文章推荐