require.js的使用

1.下载require.js,放到项目中

在HTML中

<script type="text/javascript" src="{{ asset('static/libs/require.js') }}"

    data-main="{{ asset('static/js/post/create') }}"></script>

加载require.js, data-main放置当前需要加载的js文件

很明显，只是加载这两个js文件是不够的，需要jquery.js，那么这里是如何实现的呢？

配置config.js

require.config({

    shim: {

        'bootstrap': {

            deps: ['jquery'],

            exports: 'bootstrap'

        },

        'bootstrap-datetimepicker': {

            deps: ['bootstrap']

        },

        'datetimepicker-locale-zh-CN': {

            deps: ['bootstrap-datetimepicker']

        },

        'jquery.cookie': {

            deps: ['jquery']

        },

        'jquery.dotdotdot': {

            deps: ['jquery']

        },

        'select2': {

            deps: ['jquery']

        },

        'select2.i18n-zh-CN': {

            deps: ['select2']

        },

        'bootstrap-growl': {

            deps: ['jquery', 'bootstrap']

        }

    },

    baseUrl: 'static',

    paths: {

        'jquery': 'libs/jquery/jquery-2.1.4.min',

        'jquery.cookie': 'libs/jquery/jquery-cookie',

        'jquery.dotdotdot': 'libs/jquery.dotdotdot/jquery.dotdotdot.min',

        'bootstrap': 'libs/bootstrap/js/bootstrap.min',

        'underscore': 'libs/underscore-min',

        'bootstrap-datetimepicker': 'libs/bootstrap-datetimepicker/js/bootstrap-datetimepicker.min',

        'datetimepicker-locale-zh-CN': 'libs/bootstrap-datetimepicker/js/locales/bootstrap-datetimepicker.zh-CN',

        'util': 'js/common/util',

        'app': 'js/app',

        'select2': 'libs/select2/js/select2.min',

        'select2.i18n-zh-CN': 'libs/select2/js/i18n/zh-CN',

        'echarts': 'libs/echarts/echarts.min',

        'nprogress': 'libs/nprogress/nprogress',

        'bootstrap-growl': 'libs/bootstrap-growl/jquery.bootstrap-growl.min',

        'clipboard': 'libs/clipboard/clipboard.min',

        'tinymce': 'libs/tinymce/tinymce.min',

        'layzr': 'libs/layzr/layzr.min'

    },

    waitSeconds: 15

});

在自己定义的js中

requirejs(['../config'], function () {

    require(['jquery', 'bootstrap', 'tinymce'], function ($) {});

});

首先加载配置的config.js

其次，require入你需要的其他脚本