fallback.io 不适用于脚本

Question

我想使用 fallback.io 中的 fallback.js，所以我使用了 github 中的文档。问题是它只适用于 css 和字体文件，但不适用于我的所有 js 脚本。

<script src="media/js/fallback.min.js"></script>
<script>
    fallback.load({

        'jquery-2.1.3.js': [
            '//ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js',
            'media/js/jquery-2.1.3.js'
        ],

        'bootstrap.min.js': [
            '//maxcdn.bootstrapcdn.com/bootstrap/3.3.2/js/bootstrap.min.js',
            'media/js/jquery-2.1.3.js'
        ],

        'smoothscroll.js': 'media/js/smoothscroll.js',

            'bootstrap.min.css': [
                '//maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css',
                'media/css/bootstrap.min.css'
            ],

            'bootstrap-theme.min.css': [
                '//maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap-theme.min.css',
                'media/css/bootstrap-theme.min.css'
            ],

            'media.css': [
                'media/css/media.css'
            ],

            'Montesserat-Regular.ttf': [
                '//fonts.googleapis.com/css?family=Montserrat',
                'media/fonts/Montserrat-Regular.ttf'
            ] 
    }, 
    {
        // Shim jQuery UI so that it will only load after jQuery has completed!
        //'jQuery.ui': ['jQuery']
        shim: {
            'bootstrap.min.js': ['jquery-2.1.3.js'],
            'media.css': ['bootstrap.min.css'],
        },

        //callback: function(failed) {
            // success - object containing all libraries that loaded successfully.
            // failed - object containing all libraries that failed to load.
            // All of my libraries have finished loading!
            // Execute my code that applies to all of my libraries here!
        //}
    });

    //fallback.ready(['jquery-2.1.3.js'], function() {
        // jQuery Finished Loading
        // Execute my jQuery dependent code here! });

    //fallback.ready(['jQuery', 'JSON'], function() {
        // jQuery and JSON Finished Loading

        // Execute my jQuery + JSON dependent code here! });

    fallback.ready(['jquery-2.1.3.js', 'bootstrap.min.js'], function() {
        // All of my libraries have finished loading!
        $('.carousel').carousel({
            interval: 1000,
            pause: hover,
            wrap: true,
            keyboard: true
        })
        // Execute my code that applies to all of my libraries here!
    });
</script>
</head>

我做错了什么？您使用哪种后备方案？

Answer 1

根据 fallback.io docs，您的 fallback.load 列表中的键必须是您正在加载的 javascript 库公开的某个变量名称。

fallback.load({libraries}, {options})

Expects to be an object containing a key value pair where the key is the library's window variable, and the value is the url to fetch the library from. The keys must be the window variable name of the library you're loading if it's a JavaScript library. This is only relevant for JavaScript libraries and not StyleSheets, for StyleSheets you can name them however you please. For example jQuery's key would be jQuery since window.jQuery exists after jQuery has finished loading. This is required to provide support for legacy browsers.

所以不做

'jquery-2.1.3.js': [
                '//ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js',
                'media/js/jquery-2.1.3.js'
            ],

你应该使用

'jQuery': [
                '//ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js',
                'media/js/jquery-2.1.3.js'
            ],

fallback.io 不适用于脚本

fallback.io doesnt work with scripts

javascript

jquery

twitter-bootstrap

cdn

fallback