我正在尝试让一个基本的 require JS 应用程序正常工作,但我遇到了一些困难,有人可以帮忙吗?我也在使用 Laravel。
包含脚本
<body>
@yield('content')
<script data-main="{{ asset('/js/main.js') }}" src="{{ asset('/js/require.js') }}"></script>
</body>
config.js
require.config({
baseUrl: "",
paths: {
"jquery": "jquery-2.1.3.min"
}
});
main.js
require(['config'], function() {
define(['jquery'], function($) {
$(document).ready(function()
{
alert("test");
});
});
});
文件夹目录结构:
/public
-- /js
-- -- jquery-2.1.3.min.js
-- -- config.js
-- -- main.js
-- -- require.js
我得到的错误是:
Uncaught Error: Mismatched anonymous define() module: function () {
alert("test");
}
最佳答案
define()
包装器应该包装模块,而不是嵌套在任何代码块内。在您的情况下,它是 require()
包装器的子级。
您的 main.js
文件应该是配置文件。因为 require.js 会将其作为第一个任务加载到依赖项列表中,以便为您的应用程序初始化并注入(inject)其他依赖项。
有两种方法可以实现此目的。
使用单独的文件(按照您的方式)
main.js
require.config({
baseUrl: "",
paths: {
"jquery": "jquery-2.1.3.min",
"app" : "main_module"
},
deps: 'app'
});
main_module.js
define(['jquery'], function($) {
$(document).ready(function(){
alert("test");
});
});
或者将您的配置放入 main.js 中。然后在里面写你的代码
require.config({
baseUrl: "",
paths: {
"jquery": "jquery-2.1.3.min"
}
});
require(['jquery'], function($) {
$(document).ready(function(){
alert("test");
});
});
关于javascript - 设置 RequireJS 时遇到问题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/29183593/