requirejs模块不将路径键识别为键,并像查找文件名一样查找键



我是requirejs的新手,并试图让一个简单的结构正常工作(请参阅下文)。我尝试了多种方法,但没有成功。

我的目标是将requirejs配置设置为所有页面共享。

我的方法是让每个页面的script标记中的datamain指向与该页面对应的模块(page.php到js/page.js)。并从相应的模块中调用js/config.js作为第一依赖项。问题是路径键在模块中不起作用。

然后我读到,应该为配置设置脚本标记中的data-main。因此,我尝试将data-main指向js/config.js,而不是相应的页面代码。然后在页面中添加了第二个脚本标记。让第一脚本标记首先加载到配置中,然后第二脚本标记加载到对应页面的模块中。但与路径相同的问题,模块中的路径键不起作用。

问题是,当我在模块(['jquery'])中使用路径键(比如说'jquery')时,浏览器会在js文件夹中查找'jquery'键,而不是在js/config.js中指定的'libs/jquery'路径中。因此,在'js/'中添加了一个baseRrl,然后尝试'/js',然后也尝试'/j/',并在paths对象中的值前面尝试'/'。没有运气。

然后我试着指向jquery的谷歌CDN,但浏览器仍然找不到它。

因此,我将关键字从"jquery"更改为"ooo",浏览器仍然在js目录中查找ooo.js文件,而不是像配置路径中指定的那样查找CDN。

不确定我的文件结构是否错误,或者路径和/或baseUrl设置是否正确。我尝试了很多不同的方法,但都没有成功。请帮忙。不确定我是不是因为看得太久而错过了显而易见的东西而失明了。谢谢你的帮助。

文件结构:------------index.phpjs/-config.js-index.js-libs/--jquery.js--require.js------------

index.php:

<head>
<script data-main="js/config" src="js/libs/require.js"></script>
<script src="js/index.js"></script>
</head>
<body>
</body>

js/config.js:

require.config({
baseUrl: 'js/',
paths: {
'ooo': 'http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min',
//'ooo': 'libs/jquery',
'mod': 'modules/module1'
},
shim: {
'ooo': {
exports: '$'
}
}
});

js/index.js:

require( ['ooo'], function( $ ) {
$( document ).ready( function() {
alert( 'work!' );
});
});

开发工具中的网络选项卡:

GEThttp://localhost/requirejs/site2/js/ooo.js404(未找到)

您不能使用data-main加载配置。data-main所做的是告诉RequireJS启动加载它所指向的模块,但不能保证此操作何时完成。您得到的错误是因为js/index.js中的require在加载js/config之前执行,因此它不使用您的配置。解决这个问题的一个非常简单的方法是使用一个模块,而不是现有的require。因此js/index.js将包含:

define(['ooo'], function( $ ) {
$( document ).ready( function() {
alert( 'work!' );
});
});

您的RequireJS配置可以有以下选项:

deps: [ 'index' ]

(是的,这只是index,不是js/index,也不是js/index.js。)deps选项告诉RequireJS立即开始加载一些模块。通过这种方式,js/index.js中的代码在加载配置之前不会执行。

相关内容

  • 没有找到相关文章

最新更新