javascript - 求require.js玩的6大神来看看这个奇葩的问题到底怎么回事

Question

首选，用的require是2.11版本的，下面是版本信息
RequireJS 2.1.11 Copyright (c) 2010-2014, The Dojo Foundation All Rights Reserved.

首先，我在页面的head部分引入了require.js并且写了它的config配置项，代码如下

require.config({
        baseUrl: "js",
        paths:{
        "jquery":"jquery-1.12.1.min",
        "unslider":"unslider",
        "common":"common",
        "index":"index"
        },
        shim:{
            "unslider": {
                deps: ["jquery"],
                exports:'unslider'
            },
            "common": {
                deps: ["jquery","unslider"],
                exports:'common'
            },
            "index":{
                deps:["jquery","unslider","common"],
                exports:'index'
            }
        }
    });
    //共计四个JS文件，关系如下
    //jq>unslider>common>index

然后我在页面的底部又重新引入了一个JS文件 代码如下

require(['jquery','unslider','common','index'],function(){
                alert("加载完成")
            })
            //仅仅只写了加载的方法

本来最开始我是将这段require的方法是写在页面底部的，并没有给script标签写src属性，但是因为JS文件异步加载的问题会导致浏览器报错$ is not defind

接下来神器的事情就发生了,

但是，当我多按几次F5刷新浏览器的时候，就会是这样

然而又没有报错了，页面的所有效果全部正常显示，我也是醉了，求个大神解释一下这到底是怎么回事。
可以的话再给我讲讲你们在使用JS模块化加载的框架的一些心得，以及在一个项目中应该怎么去使用

Answer 1

看样子你的index和common两个文件里，分别直接使用了变量jQuery和$吧？

既然模块化了，是不是要引入一下？

define(['jquery'], function ($) {

    //引入再使用
    $(document).on('click', function(e){
        alert(e);
    });
});

Answer 2

我也遇过一样的问题，当时卡了两天也没解决，转战 webpack 了