requirejs中在data-main加载配置信息，如何解决加载顺序问题？

Question

<script data-main="scripts/config" src="scripts/require.js"></script>
<script src="scripts/other.js"></script>

//config.js

require.config({
    paths: {
        foo: 'libs/foo-1.1.3'
    }
});

//other.js
require( ['foo'], function( foo ) {

});

requirejs文档有这样一句话：

注意：你在data-main中所设置的脚本是异步加载的。所以如果你在页面中配置了其它JS加载，则不能保证它们所依赖的JS已经加载成功。

因为项目里面requirejs的配置都是公用的，我就想将配置单独设在config.js里面用data-main的形式加载,但是不能在加载other.js之前保证config.js加载完，所以有时候other.js里面的依赖会加载了scripts/foo.js，而不是require.config指定的libs/foo-1.1.3。

请问这样怎么处理，一般项目requirejs配置大家都是怎么处理的？

Answer 1

shim:{

other:['a','b']
}

Answer 2

<script type="text/javascript" src="dev/js/libs/require.js"></script>
<script type="text/javascript" src="dev/js/config.js"></script>
<script type="text/javascript" src="dev/js/app/index.js"></script>

Answer 3

一般我们会在最后用Requirejs的node工具r.js打包成一个js文件。

所以，不存在加载顺序的问题。

Answer 4

如果要加载other.js之前先加载其它的文件，你可以在shim中配置依赖：

shim:{

other:['a','b']
}

这表示，other依赖a,b两个模块，你在加载other的时候会先按顺序加载a,b，成功后在加载other

Answer 5

开发调试的dev环境需要config.js，因为你尚未打包依赖。配置如下：

html<script type="text/javascript" src="dev/js/libs/require.js"></script>
<script type="text/javascript" src="dev/js/config.js"></script>
<script type="text/javascript" src="dev/js/app/index.js"></script>

配置写在require.js后。

打包后的build环境，如果打包文件index.js没有外部依赖（比如依赖dialog,dialog是远程组件），那么在打包后，你根本是不需要config.js配置文件的。即：

html<script type="text/javascript" src="build/js/libs/require.js"></script>
<script type="text/javascript" src="build/js/app/index.js"></script>

否则，打包后，仅仅只需要配置文件对远程的依赖组件进行配置，命名另一个配置文件为config-remote.js。配置如下：

javascriptrequire.config({
    baseUrl: staticHost,//这个参数设置是没有必要的
    paths: {
        'dialog': 'http://xxx/xxxx/dialog'
    }
});

有远程依赖的打包上线后的配置为：

html<script type="text/javascript" src="build/js/libs/require.js"></script>
<script type="text/javascript" src="build/js/config-remote.js"></script>
<script type="text/javascript" src="build/js/app/index.js"></script>

Answer 6

这个英文文档我也看了。
我感觉你那句话理解错了
注意：你在data-main中所设置的脚本是异步加载的。所以如果你在页面中配置了其它JS加载，则不能保证它们所依赖的JS已经加载成功。

你看它后面的解释，它是说require.config里加载libs/foo-1.1.3不一定比require早，会导致require加载时，去加载foo模块，结果没有了，就出错。foo模块是加载libs/foo-1.1.3成功后给的别名。
//config.js
require.config({

paths: {
    foo: 'libs/foo-1.1.3'
}

});

和<script src="scripts/other.js"></script>这个没有关系。

这段英文这样写是很容易让人误解为和other.js有关系。

它后面也给了答案：
把这个config这段写到html里面，不要写到js里面。